Question

我正在使用jQuery.ajax（）方法加载一些代码。在这段代码中，我想要一些jQuery-UI Widgets（滑块和日历），但它们不会出现在IE中。

这里有一些示例代码，您可以帮助我了解我的错误。

将加载jQuery-UI Widgets的代码

<script>
jQuery(document).ready(function(){
  jQuery.ajax({
    type:'post',
    url: 'file.php',
    success: function (data) {
     jQuery('.somediv').empty().html(data); 
    }
  });
});
</script>

加载的代码，应该初始化jQuery-UI Widgets

<script>
jQuery(document).ready(function(){
  jQuery('.datepicker-div').datepicker(someoptions);
  jQuery('.slider-div').slider(someoptions);
});
</script>
<div class="datepicker-div">
<div class="slider-div">

你可以看到它应该很简单。对于FF，它工作正常但不适用于IE。

也许它与文档就绪声明无关？

Answer 1

只需在成功事件中调用初始值设定项：

<script>
jQuery(document).ready(function(){
  jQuery.ajax({
    type:'post',
    url: 'file.php',
    success: function (data) {
      jQuery('.somediv').empty().html(data); 
      jQuery('.datepicker-div').datepicker(someoptions);
      jQuery('.slider-div').slider(someoptions);
    }
  });
});
</script>

当然，你应该通过一个初始化函数来重构它：

function Initialize(){
  jQuery('.datepicker-div').datepicker(someoptions);
  jQuery('.slider-div').slider(someoptions);
}

然后你的成功称呼它，以及ready() ebent：

<script>
jQuery(document).ready(function(){
  jQuery.ajax({
    type:'post',
    url: 'file.php',
    success: function (data) {
     jQuery('.somediv').empty().html(data); 
     Initialize();
    }
  });
});
</script>

<强>更新

我已经仔细阅读了你的问题，现在我完全明白了。您的ready()位于已加载的代码中。然后你应该使用jQuery的load()：

脚本执行

使用不带后缀选择器的URL调用.load（）时   表达式，内容在脚本出现之前传递给.html（）   除去。这将在丢弃之前执行脚本块。如果   使用附加到URL的选择器表达式调用.load（），   但是，在更新DOM之前，脚本会被删除，   因此不会被执行。两种情况的例子如下所示：

这里，作为文档一部分加载到#a的任何JavaScript都将   成功执行。

$('#a').load('article.html');

Answer 2

尝试在附加html之前删除脚本，然后再添加它们。

var outHTML = data.replace(/<script>/ig,"<div class='script'>").replace(/<\/script>/ig,"</div>");
outHTML = $(outHTML);
var script = outHTML.find("div.script").detach();
$(".somediv").html(outHTML);
var s = document.createElement("script");
s.textContent = script.text();
document.body.appendChild(s);

编辑：

根据您的ajax请求返回的内容，

.find("div.script")可能需要更改为.filter("div.script")。

Answer 3

好的，我没有发现如何解决问题，但我找到了解决方法。

解决方法非常简单。因为在除IE之外的每个浏览器中，通过ajax加载脚本工作正常，我们必须识别IE并将行为更改为不加载脚本但重定向到我想加载的站点。我在Joomla 2.5中都这样做，所以有一些工作要做，但基本上是以下代码解决了这个问题。

// preparing the url
// check for ie
if (jQuery.browser.msie) {
  window.location(url);
} else {
  // do the ajax
}

jQuery（document）.ready（）不适用于加载AJAX的jQuery-UI小部件

3 个答案:

脚本执行