不确定这是一个bug还是我不应该这样做
我有一个带有侧栏的页面,它可以动态加载主体。
对于page1,我有一个元素#id1
的回调,它在初始加载时工作。
在用户导航到page2后,主要内容将被page2的内容所取代,其中也有一个具有#id1
的元素,它们具有相同的目的。事件也在那里初始化。
问题是第2页上的所有内容都可以工作,除了与#id1
相关的事件。
如果返回到第1页,#id1
将不能正常工作。
查看控制台后,我发现在调用$("#id1")
时有时会给我初始加载元素(而不是销毁?),这可能是原因。
ajax加载只是使用:
$.get(path, function(data) {$('#main').html(data)});
你知道这是怎么回事吗?
如果旧的元素没有"在jquery中正确销毁",应该在这里做什么呢?
虽然不清楚您要绑定的确切内容,但解决方案是使用(取决于您的jQuery版本)live()
或on()
来确保绑定到执行时不在DOM中的元素。
jQuery 1.7+: on()
$(document).on('click', '.selector', function() { ... });
jQuery <1.7: live()
$('.selector').live('click', function() { ... });
记住一个ID只能出现一次
因为您不知道在Ajax调用之后,ID
's的哪些元素可能仍然存在于DOM中,因此您应该坚持使用classname
's。
你可以使用jQuery的.live()
来绑定已经动态加载的元素
您必须为此生成动态id。当您单击右侧栏选项时,将生成id并将id放置在body元素"id"标记中。这样您就知道哪个id是为哪个页面生成的。在"onclick"事件上调用javascript函数,并将id传递给该函数,然后将body元素调用为$("#id"+that generated_id).something;
我想这会有帮助。