附加事件处理程序动态添加元素

问题描述：

我有一个javascript代码，它动态地添加一个元素并为它添加事件处理程序。
当添加元素时，会调用此事件处理程序（并消失）。
当我通过检查器看到动态添加的元素（查看事件处理程序是否添加成功）我找不到onchnage="texttol(eletext)"函数添加它。附加事件处理程序动态添加元素

eletext = document.createElement("input"); 
eletext.type="text"; 
eletext.placeholder = "Type Here"; 
eletext.onchange=texttol(eletext); 
event.target.appendChild(eletext);

jQuery使用'.live（）'，而不是'。对（）'来解决你所描述的情况。即使你不使用JQuery，你也可以看看它是如何实现的。 – Felix

分配'onchange'属性不会更改DOM中的'onchange'属性。 – zzzzBov

@Felix，'live'已被弃用一段时间了。事件代表团是适当的。也就是说，这个问题没有jQuery标记，所以这不是一个合适的答案。 – zzzzBov

答

通过这一行，您可以调用方法texttol并将其返回的任何内容附加到事件处理函数中。

eletext.onchange=texttol(eletext);

你需要使用一个封闭

eletext.onchange = function() { texttol(eletext) };

甚至更好，使用的addEventListener

我试过这些chnages，它的工作！ – user3856170

答

添加您的事件处理，一旦元素实际上是在DOM。

var eletext = document.createElement("input"); 
 
eletext.type = "text"; 
 
eletext.placeholder = "Type Here"; 
 
eletext.id = "eletext"; 
 
document.body.appendChild(eletext); 
 

 
eletext.addEventListener('change', function(e) { 
 
    texttol(eletext.value); 
 
}, false); 
 

 
function texttol(str) { 
 
    alert('texttol function passes: ' + str); 
 
}

附加事件处理程序动态添加元素

相关推荐