我有一个通过ajax加载的对话框。该ajax的paylaod包含html和javascript。
对话框显示正常,并且该有效负载中包含的JS将执行。
但是,我无法从有效负载中的JS中选择任何元素(无论是id,类还是元素类型)。
让我们说有效载荷有:
<div>
<ul id="testid">
<li>A</li>
<li>B</li>
</ul>
</div>
<script type="text/javascript">
$(document).ready(function() {
console.info('test: ' + $("#testid").length);
});
</script>
这导致test:0出现在控制台中。
如果我更改选择器以选择'body',那么它会导致非零值。
显然正在显示已加载的内容,并且它正在执行包含IS的JS,我的理解是.ready()调用应该允许更新DOM时间以包含html有效负载。
不幸的是,在这个例子中,我无法直接控制ajax加载本身,因为我正在使用一个为我执行对话功能的框架(zotonic)。
奇怪的是,其他ajax加载的页面我有JS选择ajax加载的有效负载中的元素正在工作 - 它只是对象的东西(到目前为止)似乎失败。
我有点不知道为什么这会出错。我已经完成了我的尽职调查并且在过去的几天内搜索了谷歌等没有解决方案,所以我想在这里大声呼救。
杰森
答案 0 :(得分:0)
我相信ready
仅在页面加载时才有效。如果您依赖于AJAX调用的结果,则需要使用回调,因为该操作是异步的。 zotonic是否为您提供可以使用的钩子?否则它会变得更难一点。也许你可以在页面加载上像这样轮询DOM:
<script type="text/javascript">
$(document).ready(function() {
var interval = setInterval(function() {
if($("#testid").length > 0) {
clearInterval(interval);
console.info('test: ' + $("#testid").length);
}
}, 750);
});
</script>
这将为#testid
每隔750毫秒查询一次页面。如果找到该元素,则会取消间隔,您应该获得控制台输出。