javascript - 使用 jQuery 更新脚本标签的 src - 使用 jQuery 重新加载脚本而不刷新页面

Question

这个问题说明了一切。如何使用 jQuery 更新脚本标签的“src”。 比方说，我有一个脚本，

 <script id="somescript" type="text/javascript" src=""></script>

所以当我点击一个按钮时，必须添加脚本的源代码。喜欢，

 <script id="somescript" type="text/javascript" src="linktoscript.js"></script>

我正在使用这样的点击处理程序，使用以下代码。

$("#somescript").attr("src","linktoscript.js");

它实际上更新了 src，但是当我通过 firebug 检查它时，它告诉我刷新页面以使脚本工作。

研究:

经过一些研究，我发现 jQuery 的 $.get() 可以完成这项工作，是的，它会加载脚本。但这并没有完成我的工作。

实际问题:

我正在尝试在成功提交表单后使用 Ajax 加载 Google 的转换代码。

这是 Ajax 脚本的一部分，应该适用于 Google 的转换代码。

                    if (res == "yes") {
                        $('#success').fadeIn().delay(5000).fadeOut();
                        $('#regform')[0].reset();
                        window.location.href = '#'; 
                        /* <![CDATA[ */
                        var google_conversion_id = xxxxxxxxx;
                        var google_conversion_language = "en";
                        var google_conversion_format = "2";
                        var google_conversion_color = "ffffff";
                        var google_conversion_label = "CiaXCOXjzlcQy__EyQM";
                        var google_remarketing_only = false;
                        /* ]]> */

 $.getScript("http://www.googleadservices.com/pagead/conversion.js");   
  }

它加载了转换脚本，但是当我从 Firebug 检查它时，转换变量的所有值都是空的。 所以我尝试将所有转换代码放入 html 文件中，然后加载转换脚本，如

 <script type="text/javascript">
  /* <![CDATA[ */
  var google_conversion_id = xxxxxxxxx;
  var google_conversion_language = "en";
  var google_conversion_format = "2";
  var google_conversion_color = "ffffff";
  var google_conversion_label = "CiaXCOXjzlcQy__EyQM";
  var google_remarketing_only = false;
  /* ]]> */ 
 </script>

 <script type="text/javascript" src="#"></script> <!--Update this src-->

 <noscript>
  <div style="display:inline">
   <img height="1" width="1" style="border-style:none;" alt="" src="#" />
  </div>
 </noscript>

有什么帮助吗？

链接:

这是实时站点的链接:Link

更新: 这就是我得到的。在 Firebug 的脚本面板中，表单提交后，

Answer 1

Google 转换脚本似乎依赖于 google_conversion_id、google_conversion_language 等可用作全局变量。假设您拥有的代码在函数内部执行(如果这是在事件内部，这将是有意义的)，您拥有的代码将不起作用，因为变量将是它们所在函数的本地变量，而谷歌代码将无法获得它们。

您可以做两件事。

一种是提前在全局范围内定义这些变量，即这样做:

<script type="text/javascript">
  /* <![CDATA[ */
  var google_conversion_id = xxxxxxxxx;
  var google_conversion_language = "en";
  var google_conversion_format = "2";
  ...
</script>

(您也可以将它们放在外部脚本文件中并在页面加载时加载该文件:

如果这样做，您可以随时加载 google 转换脚本，它将能够访问这些变量:

$.getScript("http://www.googleadservices.com/pagead/conversion.js");   

另一种选择是在加载脚本之前将变量分配给 window 对象，这相当于将它们放在全局范围内:

if (res == "yes") {
    $('#success').fadeIn().delay(5000).fadeOut();
    $('#regform')[0].reset();
    window.location.href = '#'; 

    window.google_conversion_id = xxxxxxxxx;
    window.google_conversion_language = "en";
    window.google_conversion_format = "2";
    window.google_conversion_color = "ffffff";
    window.google_conversion_label = "CiaXCOXjzlcQy__EyQM";
    window.google_remarketing_only = false;

    $.getScript("http://www.googleadservices.com/pagead/conversion.js");   
}

---

注意:关于这个问题最初的问题，您不能通过更改现有脚本元素的 src 属性来加载脚本:

http://jsfiddle.net/5vf6b924/

一旦 script 元素加载了 src 指示的任何内容(即使它是 #)，它基本上就“用完了”并且不会加载任何其他内容。

您可以做的是创建一个新的 script 元素并将其添加到 DOM:

http://jsfiddle.net/ydu52cn1/

这应该会成功加载脚本(异步)。

如您所见，jQuery 还为此提供了 $.getScript 便捷方法。