的onclick从不会触发

我有我的网站，每个用户滚动到页面底部时加载数据中的过程性饲料分页负载按钮;通常的东西。的onclick从不会触发

分页本身工作正常;然而，利用JavaScript的按钮的点击不起作用。完全一样。

这是的JavaScript触发按钮它不工作：

var modalTrigger = document.querySelectorAll(".ts-modal__trigger"), // the buttons 
    modal; 

document.onclick = function(e){ // document on click 
    for(var i = 0; i < modalTrigger.length; i++){ // iterate through each button 
     if(e.target == modalTrigger[i]){ // if target clicked was button 
      e.stopPropagation(); // stop dom event from bubbling 
      modal = document.getElementById(modalTrigger[i].getAttribute("data-activemodal")); 

      document.body.style.overflow = "hidden"; // disable scroll on page 
      modal.style.display = "block"; // display modal 
     } 
    } 
}

据我所知，这应该被工作（使用的stopPropagation()），但很可惜，它不是。

我打算使用内联JS，但我觉得这是非常不必要的，可以做这只是一对夫妇的独立的JavaScript线，而不是添加额外的HTML混进去了没有理由。

所以任何和所有帮助表示赞赏，

谢谢。 :)

小提琴：https://jsfiddle.net/xhp4cesr/

编辑：我注意到，在按钮中移除span后，它的工作，但只要它增加了回来，它不会。你可以这样做

来源

2017-03-18 GROVER.

如果调用此'document.querySelectorAll（ “TS-modal__trigger”）'加载，那么它将不会选择稍后由ajax加载的元素。 – abhishekkannojia

不知道这是如何工作的，伙计。很确定它会检查'for'循环，在'document'点击。但是，我可能是错误的:)发表一个答案，如果你认为否则 –

为什么你不尝试和移动你的'modalTrigger'内的onclick函数声明，看看是否有效。 – abhishekkannojia

一种方法是在文档中删除e.stopPropogation也针对儿童

var modalTrigger = document.querySelectorAll(".ts-modal__trigger"), // the buttons 
 
    modal; 
 

 
document.onclick = function(e) { // document on click 
 
    for (var i = 0; i < modalTrigger.length; i++) { // iterate through each button 
 
    if (e.target == modalTrigger[i] || modalTrigger[i].children) { /* <- added children as target */ 
 
     modal = modalTrigger[i].getAttribute("data-activemodal"); 
 
     console.log(modal); 
 
    } 
 
    } 
 
}

a { 
 
    background: red; 
 
    padding: 40px; 
 
} 
 

 
span { 
 
    color: yellow; 
 
}

<a class="ts-modal__trigger" data-activemodal="ts-main-feed_status-comments-overlay"> 
 
    <span>11</span> 
 
</a>

来源

2017-03-18 09:04:16

纠正我，如果我错了，但不应该是“||”。 e.target == modalTrigger [i] .children'？ :) –

没有必要 - 你要么分配 –

依然不工作：/ –

的onclick从不会触发

回答

相关问题