将点击事件绑定到通过AJAX加载的内容，纯JavaScript实现，不使用jQuery。

Question

我想知道如何绑定一个点击事件到一个稍后通过ajax调用添加的元素。我知道在jQuery中可以这样做：

$(document).on('click', '.ajax-loaded-element' function(){});

但是这个时候我没有使用 jQuery。我的想法类似于以下代码，但是如果你调用同一个文件两次，它就不起作用了（我不确定是否需要这样做，但我希望代码更加健壮）。

bindAjaxBtn: function(selector, fnName) {
    let isBinded = false;
    document.addEventListener('click', function(e) {
        const btn = document.querySelector(selector);
        if(btn === e.target) {
            if(!isBinded) {
                btn.addEventListener('click', function() {
                    fnName();
                    isBinded = true;
                });
                btn.click();
            }
        }
    });
},

任何帮助都将不胜感激。 :)

- zmuci

Answer 1

非常简单。你可以试试这个。 这会对你有所帮助。

document.getElementById('btn').setAttribute('onClick','myfunction()');
function myfunction(){
  alert('Button Clicked');
}

<button id="btn">Click Here</button>

愉快的编码。

- Yash Parekh

---

不，你的代码并没有将事件绑定在父节点上。你将事件绑定在尚未加载到页面上的元素上（因为使用了ajax加载）。 - undefined