jQuery不会在动态加载的内容上执行,即使在单击事件上也不会执行
问题描述:
我有两个document.ready()
函数.第一个将内容加载到div#header
中.第二个执行隐藏功能,然后对新加载的内容执行切换功能.我不确定这是否是排队问题,但是单击加载的内容时甚至不会执行下面的alert()
.谢谢.
I have two document.ready()
functions. The first loads content into div#header
. The second one performs a hide function and then a toggle function on the newly loaded content. I am not sure if this is a queueing issue or something, but not even the alert()
below is executed when I click the loaded content. Thanks.
<script type="text/javascript">
$(document).ready(function() {
$("#header").load("/documents/collegeradioheader.txt");
});
</script>
<script type="text/javascript">
$(document).ready(function() {
$(".hideme").hide();
$(".slick-toggle").click(function() {
alert('hi');
$(this).parent().next('div').slideToggle('fast');
});
});
</script>
简化代码
答
尽管 live
是一个有效的解决方案,AJAX中有一个complete
事件 load
在加载时触发已经结束.
Although the live
is a working solution, there is an complete
event in the AJAX load
that fires when the load has finished.
<script type="text/javascript">
$(function() {
$("#header").load("/documents/collegeradioheader.txt", function() {
$(".hideme").hide();
$(".slick-toggle").click(function() {
alert('hi');
$(this).parent().next('div').slideToggle('fast');
});
});
});
</script>