非常有趣的jQuery的加载行为，错误或解决方案？ [英] Very interesting jQuery load behavior, a bug or solution?

问题描述

最近我试图找到一些脚本的错误，我用jQuery加载页面时发现了这个非常有趣的现象。

文件＃1：Test1.htm

 ＆LT; D​​IV ID =测试＆GT;＆LT; / DIV＆GT;

＆LT;脚本类型=文/ JavaScript的＆GT;
$（文件）。就绪（函数（）{
 $（'＃测试）。负载（test2.htm＃内容，函数（）{
  警报（加载完成！）;
 }）
}）
＆LT; / SCRIPT＆GT;
 

文件＃2：Test2.htm

 ＆LT; D​​IV ID =内容＆GT;
你好

＆LT;脚本类型=文/ JavaScript的＆GT;
$（文件）。就绪（函数（）{
 警报（你好＃1）;
}）
＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
$（文件）。就绪（函数（）{
 警报（你好＃2'）;
}）
＆LT; / SCRIPT＆GT;

＆LT; / DIV＆GT;
 

现在，当我运行Test1.htm，我得到如下：

• 你好＃2警报
• 你好从test2.htm显示器
• 在加载完成警报

正如你所看到的唯一区别是脚本标签是为你好＃2警报大写。该脚本显示打招呼＃1戒备从来没有得到exectued ...

到目前为止，我已经在Firefox 3.55测试了这个，IE 8.0.6001.18702和Chrome 3.0.195.33有类似的结果。

在过去，我想从加载的内容，类似于execture JavaScript来<一href="http://stackoverflow.com/questions/75943/how-do-you-execute-a-dynamically-loaded-javascript-block">this SO质疑。所以我的问题是，这是一个错误或一个解决方案吗？

---

更新：由于抖动低于指出，同样的事情发生，如果Test2.htm有我加载的内容之外的脚本

。

 ＆LT; D​​IV ID =内容＆GT;
你好，从test2.htm
＆LT; / DIV＆GT;

＆LT;脚本类型=文/ JavaScript的＆GT;
$（文件）。就绪（函数（）{
 警报（你好＃1）;
}）
＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
$（文件）。就绪（函数（）{
 警报（你好＃2'）;
}）
＆LT; / SCRIPT＆GT;
 

解决方案

事实上，这似乎是jQuery中的一个错误。你应该张贴一个bug票。 - 尼斯找到BTW。

在的jQuery 1.3.2 线3270- 3272我们有

的 //注入​​文档的内容中，除去脚本
//避免任何权限被拒绝的错误在IE浏览器
.append（res.responseText.replace（/＆LT;脚本（| \ S）* \ / SCRIPT＆GT;？/克，））
 

显然不区分大小写的标志我在这个表达式缺失。因此，每一个＆LT;脚本＆GT; ...＆LT; / SCRIPT＆GT; 标签，它并不像＆LT全部小写; SCRIPT＆GT; ，＆LT;脚本＆GT; ，＆LT; SCRIPT＆GT; ，...不被jQuery的是去除意。

所以行3272应为

  .append（res.responseText.replace（/＆LT;脚本（| \ S）* \ / SCRIPT＆GT;？/ GI，））
 

此外这个bug您在负载URL的选择器的使用时才会触发 test2.htm＃内容。如果你离开，一出和使用

  $（'＃测试）的负载（'test2.htm'，函数（）{...}）。
 

和 test2.htm 如下所示，将火三警报太（不管你怎么写脚本标记）。所以这也是一个角落的情况下错误了。

 你好

＆LT;脚本类型=文/ JavaScript的＆GT;
$（文件）。就绪（函数（）{
 警报（你好＃1）;
}）;
＆LT; / SCRIPT＆GT;
＆LT;脚本类型=文/ JavaScript的＆GT;
$（文件）。就绪（函数（）{
 警报（你好＃2'）;
}）
＆LT; / SCRIPT＆GT;
 

I was recently trying to find a bug in some scripting and I discovered this very interesting behavior when loading a page with jQuery.

File #1: Test1.htm

<div id="test"></div>

<script type="text/javascript">
$(document).ready(function(){
 $('#test').load('test2.htm #content',function(){
  alert('done loading!');
 })
})
</script>

File #2: Test2.htm

<div id="content">
howdy

<script type="text/javascript">
$(document).ready(function(){
 alert('hello #1');
})
</script>
<SCRIPT type="text/javascript">
$(document).ready(function(){
 alert('hello #2');
})
</SCRIPT>

</div>

Now when I run Test1.htm, I get the following:

• hello #2 alert
• howdy from test2.htm displays
• done loading alert

As you can see the only difference is the script tag is in upper case for the hello #2 alert. The script to show the hello #1 alert never gets exectued...

So far, I've tested this in Firefox 3.55, IE 8.0.6001.18702 and Chrome 3.0.195.33 with similar results.

In the past, I've wanted to execture javascript from the loaded content, similar to this SO question. So my question is, is this a bug or a solution?

---

Update: As Jitter states below, the same thing happens if Test2.htm has the script outside the content I am loading.

<div id="content">
howdy from test2.htm
</div>

<script type="text/javascript">
$(document).ready(function(){
 alert('hello #1');
})
</script>
<SCRIPT type="text/javascript">
$(document).ready(function(){
 alert('hello #2');
})
</SCRIPT>

解决方案

Actually this seems to be a bug in jQuery. You should post a bug-ticket. Nice find btw.

In jQuery 1.3.2 line 3270-3272 we have

// inject the contents of the document in, removing the scripts
// to avoid any 'Permission Denied' errors in IE
.append(res.responseText.replace(/<script(.|\s)*?\/script>/g, ""))

Clearly the case-insensitive flag i on this regex is missing. Thus every <script>...</script> tag which isn't all lower case like <SCRIPT>, <Script>, <scriPt>, ... isn't removed by jQuery as intended.

So line 3272 should look like

.append(res.responseText.replace(/<script(.|\s)*?\/script>/gi, ""))

Additionally this bug is only triggered by your usage of an selector in the load url test2.htm #content. If you leave that one out and use

$('#test').load('test2.htm',function(){....});

and test2.htm looks like the following it will fire three alerts too (no matter how you write the script tag). So this is also a corner case bug too.

howdy

<SCRIPT type="text/javascript">
$(document).ready(function(){
 alert('hello #1');
});
</SCRIPT>
<script type="text/javascript">
$(document).ready(function(){
 alert('hello #2');
})
</script>

这篇关于非常有趣的jQuery的加载行为，错误或解决方案？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！