Question

我在使用jQuery AJAX调用时遇到了一些问题。当我请求一个没有javascript的页面时，我的代码工作正常，但是当我的代码中有脚本标签时，事情开始变得怪异。

似乎任何引用外部URL的脚本标记都会导致浏览器重定向。在Firefox中，页面变为空白。在safari中，页面将清除并加载AJAX响应的内容。在这两种浏览器中，URL都不会更改。

具体说明我的问题;我有一个标签控件，我正在尝试嵌入walkcore小部件。由于它在客户端非常繁重，我只想在用户单击它所在的选项卡时实际加载它.scalkcore AJAX页面如下所示：

<script type="text/javascript">
  var ws_address = "1 Market St, San Francisco";
  var ws_width = "500";
</script>
<script type="text/javascript" src="http://www.walkscore.com/tile/show-tile.php?wsid=MY_WSID">
</script>

在AJAX调用上引用外部网站的脚本标签是否有一些限制？这有什么好办法吗？

- 编辑 -

好的我已经玩过一段时间了，并且稍微缩小了问题范围。让我试着在同一时间给出一个更好的解释：

我有两个文件，index.html和walkscore.html

的index.html

function widget() {
  var widget = $('#walkscore');
  $.get('/walkscore.html', function(data) {
    $('#loading').slideUp(function() {
      widget.html(data);
      loaded[name] = true;
      widget.slideDown();
    });
  });
}

walkscore.html - 如顶部代码块所示

在index.html中，我有一个调用widget功能的链接。每当我单击此链接时，整个页面将被js文件的输出替换。无论js文件来自哪个域，都会发生这种情况。它似乎只发生在其中包含document.write的js文件中。当我使用$ .getScript函数时它的行为方式完全相同，即使它在index.html中也是如此

- 编辑 -

它似乎与document.write有关。我制作了一个walkcore javascript的副本，并用jquery.html替换了所有出现的document.write，它似乎正常工作。我（显然）是一个js noob。这是document.write的预期行为吗？当我在页面加载中包含脚本时，为什么不这样做？

Answer 1

从html内容中单独加载脚本，您可以使用$ .getScript（）。

Answer 2

它与响应中的document.write有关。我可以通过这样做来解决这个问题：

<script type="text/javascript">

  // save default document.write function so we can set it back
  var write_func_holder = document.write;

  // redefine document.write to output text target div
  document.write = function(text) {
    $('#ad_container').html($('#ad_container').html() + text);
  }
</script>

<script language="JavaScript" type="text/javascript" src="javascriptfile">
</script>

<script type="text/javascript">
  // reset document.write function
 document.write = write_func_holder;
</script>

我仍然在Safari中遇到一个问题，浏览器刷新到只有document.write和IE6内容的空白页面，IE7根本不做任何事情。 Firefox可以工作。

我希望这可以帮助有人找出错误，然后他们可以修复IE6 / 7和Safari问题

Answer 3

因为document.write调用而发生这种情况。以下是有关正在发生的事情的一些信息：

在页面加载后写作

如果在页面加载完成后调用document.write（），则页面的整个静态（非脚本生成的）内容将被write方法的参数替换。当从事件处理程序调用write方法时，通常会播放此场景 - 无论方法是在事件处理程序调用的函数中还是在处理程序内部单独调用 - 因为事件处理程序在页面加载完成后触发。这一点很重要，因为静态内容替换并不总是理想的结果。内容覆盖的另一种常见情况与将内容写入新窗口有关。在这种情况下，覆盖空白页面是目标。（source）

我使用的解决方案是删除document.write命令，然后替换div的内容。如果您正在加载外部脚本，并且无法控制它，则可以将document.write函数替换为您自己的。这里讨论了：

http://www.webxpertz.net/forums/showthread.php?threadid=11658

希望帮助那里的人！

Answer 4

替换document.write是要走的路。这是无耻的自我推销，但如果你有一个非平凡的案例，writeCapture.js处理所有边缘案例。

Answer 5

我首先检查该脚本源的响应，可能会导致不需要的行为。

Answer 6

我正在经历完全相同的行为，昨晚花了一些令人沮丧的时间试图弄清问题是什么，并寻找无济于事的答案。我很惊讶这在jquery文档的任何地方都被提到过，因为它似乎是一个看似合理的问题而不是一些疯狂的永远不会遇到的bug。

无论如何，这是我的故事，万一有人搜索相关的东西。

我有一个启用了jquery的页面，它使用$ .ajax（）将一些内容加载到div中，这一切都完美无缺。我需要做的是包括一个显示计数的推特转发按钮，并使您能够在页面上发布有关内容的推文。要做到这一点，页面上应该包含一些简单的javascript。

<script type="text/javascript" src="http://www.retweet.com/static/retweets.js"></script>

理论上，该脚本标记应该在ajax调用中返回，jquery应该执行它并包含它的结果，因为我在$ .ajax（）调用中将数据类型指定为html。

仔细检查的外部脚本确实：

if(!url)
{
 var url=window.location.href;
}
if(!size)
var size="big";
var height="75";
var width="54"
if(size=="small")
{
  height="22";
  width="120";
}
if(!username)  
  var username="none";
url=url.replace("?", "*");
var src="http://www.retweet.com/widget/button/"+size+"/"+username+"/"+url;
document.write('<iframe src="'+src+'" height="'+height+'" width="'+width+'" frameborder="0" scrolling="no"></iframe>');

这显然是对document.write的轰炸。

今晚我将尝试这篇文章中的方法，看看它们是否有效，感谢您的信息。

使用响应中的脚本标记在AJAX上刷新浏览器

6 个答案: