我在一节中有两个Prototype JS观察者,根据其他用户操作,内容可能有所变化,但div的结构却没有变化。问题是包含两个元素的div通过ajax调用()动态更改。因此,我的代码只能运行一次,并且在ajax调用(新的Ajax.Request(url,{parameters ...))之后,即使元素具有相同的类名,divs结构等,所有内容也会停止工作。
更具体地说,这就是我所拥有的:
<!-- COD Hck -->
<script type="text/javascript">
$$('.pm_cashondelivery').invoke('on','click','.pm_cashondelivery', function(event, el){
$('id_flatrate_flatrate').setStyle({'display': 'block'});
$$('.metodose').each(
function(elem){
elem.checked=false;
});
$('s_method_flatrate_flatrate').checked=true;
$$('.mayor').each(
function(elem){
elem.setStyle({'display': 'none'})
});
});
$$('.metrest').invoke('on', 'click','.metrest', function(event, el){
$('id_flatrate_flatrate').setStyle({'display': 'none'});
$$('.metodose').each(
function(elem){
elem.checked=false;
});
$$('.mayor').each(
function(elem){
elem.setStyle({'display': 'block'})
});
$$('.mayor input').each(
function(elem){
setTimeout(function(){
elem.setAttribute('checked',true);
},1);
elem.checked=true;//Check double time due Chrome bug
});
});
</script>
第一个观察者是:
$$('.pm_cashondelivery').invoke('on','click','.pm_cashondelivery', function(event, el){
。第二个观察者是$$('.metrest').invoke('on', 'click','.metrest', function(event, el){
。即使在相同的div中进行了ajax调用,我也需要这些观察者仍在工作。任何帮助将不胜感激。里卡多
最佳答案
如果在每个Ajax请求中都重新创建div.pm_cashondelivery
和div.metrest
元素,则需要在文档树的上方找到一个元素,以将委托的事件处理程序附加到该元素上。
例如:
$(document).on("click", ".pm_cashondelivery", function(event) {
// ...
});
$(document).on("click", ".metrest", function(event) {
// ...
});