我遇到了一个事件侦听器问题，它在错误的对象上触发。
要查看它，请单击“Min”下方数字的一个 td
完整的js代码如下：
var minedit = document.getElementsByClassName('min-edit');
for (var m=0;m<minedit.length;m++){
minedit[m].addEventListener('click', edit);
}
function edit(){
this.removeEventListener('click', edit);
var avalue = this.innerHTML;
if (this.className.indexOf('input-open')>=0){
}
else {
this.className += 'input-open';
var content = '';
content += '<div class="input-group editable-input"><input type="text" id="minedit'+this.parentNode.childNodes[1].id+'" value="'+parseFloat(avalue).toFixed(2)+'" class="form-control"><span class="input-group-addon editable-input" id="savethis"><i class="ion-android-done" ></i></span><span class="input-group-addon editable-input"><i class="ion-android-close" id="close"></i></span></span></div>';
this.innerHTML = content;
var valuenow = document.getElementById('minedit'+this.parentNode.childNodes[1].id).value;
var id = document.getElementById('minedit'+this.parentNode.childNodes[1].id).id;
var save = document.getElementById('savethis');
save.addEventListener('click', savethis(valuenow, id));
}
function savethis(v,id) {
console.log(id.replace('minedit','')+'Button clicked: '+v);
}
}
这是一个fiddle http://jsfiddle.net/e207wmmo/
怎么了：
有了这行：
var content = '';
content += '<div class="input-group editable-input">
<input type="text" id="minedit'+this.parentNode.childNodes[1].id+'" value="'+parseFloat(avalue).toFixed(2)+'" class="form-control">
<span class="input-group-addon editable-input" id="savethis"><i class="ion-android-done" ></i></span>
<span class="input-group-addon editable-input"><i class="ion-android-close" id="close"></i></span></span></div>';
this.innerHTML = content;
我正在创建一个输入字段和两个跨度，其中一个的 ID 为“savethis”。现在我添加eventlistener on savethis:
var valuenow = document.getElementById('minedit'+this.parentNode.childNodes[1].id).value;
var id = document.getElementById('minedit'+this.parentNode.childNodes[1].id).id;
var save = document.getElementById('savethis');
save.addEventListener('click', savethis(valuenow, id));
但功能savethis在innerHTML 更改为输入字段时调用。您可以在fiddle http://jsfiddle.net/e207wmmo/单击“最小”TD 之一时。
有人可以帮我弄这个吗？为什么该函数是在单击行时调用的，而不是在单击跨度时调用的？
在 addEventListener 中，您正在调用 savethis 函数，而不是将其传入
Change
save.addEventListener('click', savethis(valuenow, id));
to
save.addEventListener('click', savethis);
并找到另一种方法在savethis函数中使用valueNow和id。
这解释了如何传递参数：https://developer.mozilla.org/en/docs/Web/API/EventTarget.addEventListener https://developer.mozilla.org/en/docs/Web/API/EventTarget.addEventListener
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
