将 Javascript .js（调用 Web 服务）异步加载到页面中答案

【问题标题】：Load Javascript .js (calls a web service) Asynchrosusly into page将 Javascript .js（调用 Web 服务）异步加载到页面中
【发布时间】：2012-05-28 20:01:40
【问题描述】：

JScript.js 文件

function Helloworld() {
$(document).ready(function () {
    $.ajax
    ({
        type: "POST",
        url: "Default.aspx/Helloworld",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: true,
        cache: false,
        success: function (msg) {
            document.getElementById('textbox').value = msg.d;
        }
    })
});

}

Default.aspx

    <head runat="server">
    <script src="jquery-1.7.1.min.js" type="text/javascript"></script>

   //Works Fine when I uncomment this 
   <%--  <script src="JScript.js" type="text/javascript"></script>--%>

    <script type="text/javascript" language="javascript">
        (function () {
        var load = document.createElement('script');
        load.type = 'text/javascript';
        load.src = 'JScript.js';
        load.async = true;
        (document.getElementsByTagName('head')[0] ||    document.getElementsByTagName('body')   [0]).appendChild(load);
    })();
    </script>
    </head>
    <body>
        <form id="form1" runat="server">
            <input type="input" id="textbox" />
    </form>
    </body>

Default.aspx.cs

protected void Page_Load(object sender, EventArgs e)
{
    Page.ClientScript.RegisterStartupScript(this.GetType(), "KeyHelloworld", "<script type='text/javascript'>Helloworld()</script>");
}

[WebMethod(EnableSession = true)]
public static string Helloworld()
{
    return "Hello World";
}

我正在尝试将此 JavaScript 文件异步加载到页面中，但上面的函数未执行是异步加载 JavaScript 文件的完整代码

【问题讨论】：

控制台没有报错？
不，我没有收到任何错误。当我调用 JavaScript 文件 async 时，我只是看不到输出。但是当我取消注释时我看到了输出。 --%>

标签： javascript asp.net ajax

【解决方案1】：

我看到的一个明显问题是您将$(document).ready() 嵌入到Helloworld() 例程中。相反，取出$(document).ready()。据推测，如果您正在调用 RegisterStartupScript，您希望在文档准备就绪时执行该 Javascript，从而使 $(document).ready() 变得多余并且可能是您的问题，因为在您的 Helloworld() 例程之前可能已经调用了 $(document).ready()被解雇了。

所以，改成下面的代码看看有没有帮助：

function Helloworld() 
{
    $.ajax
    ({
        type: "POST",
        url: "Default.aspx/Helloworld",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        async: true,
        cache: false,
        success: function (msg) {
            document.getElementById('textbox').value = msg.d;
        }
    })
}

【讨论】：

你说得对，它有效。但只有在 IE 中，当我尝试在 chrome 中加载它时，mozilla 它不起作用......你知道为什么吗？？？？？？
在 chrome 或 mozilla 中是否会调用页面代码隐藏中的 Helloworld() 方法？
不！ Helloworld() 不会在 Mozilla 或 Chrome 中调用，但会在 IE 中调用
在下面的帖子中顶一下，并尝试一些建议；我相信它可能会有所帮助：jquery ajax problem in chrome

【解决方案2】：

您似乎异步加载脚本，但同步调用它。 Page.ClientScript.RegisterStartupScript 会在输出 HTML 中的哪个位置出现？

您需要为动态添加的脚本安装负载处理程序：

    ...
    load.async = true;
    load.onload = function() {
        Helloworld(); // execute when loaded?
    };
    ...

或者直接执行，即去掉Helloworld的方法声明。

【讨论】：