This question already has answers here:
Javascript “addEventListener” Event Fires on Page Load [duplicate]
(2个答案)
2年前关闭。
我在使用错误的对象触发事件监听器时遇到问题。
要查看它,请点击“ td”下方的数字
这是完整的js代码:
这是fiddle
怎么了:
用这行:
我正在创建一个输入字段和两个范围,其中一个的ID为“ savethis”。现在,我在savethis上添加事件监听器:
但是,当innerHTML更改为输入字段时,将调用函数savethis。单击“最小” TD之一时,您可以在fiddle中看到它。
有人可以帮我弄这个吗?为什么在单击行而不单击跨度时调用该函数?
至
在savethis函数中找到另一种使用valueNow和id的方法。
这说明了如何传递参数:https://developer.mozilla.org/en/docs/Web/API/EventTarget.addEventListener
(2个答案)
2年前关闭。
我在使用错误的对象触发事件监听器时遇到问题。
要查看它,请点击“ 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
怎么了:
用这行:
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”。现在,我在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));
但是,当innerHTML更改为输入字段时,将调用函数savethis。单击“最小” TD之一时,您可以在fiddle中看到它。
有人可以帮我弄这个吗?为什么在单击行而不单击跨度时调用该函数?
最佳答案
在addEventListener中,您正在调用savethis函数,而不是将其传递给
更改
save.addEventListener('click', savethis(valuenow, id));
至
save.addEventListener('click', savethis);
在savethis函数中找到另一种使用valueNow和id的方法。
这说明了如何传递参数:https://developer.mozilla.org/en/docs/Web/API/EventTarget.addEventListener
07-26 01:30