I have to trigger an event with a delay. The handler adds a border to any paragraph that is being read. The delay can be changed by the user. When I added the timeout, the border is never shown, while without the timeout it does. How can I trigger the event with delay?
我必须延迟触发事件。处理程序为正在读取的任何段落添加边框。用户可以改变延迟。当我添加超时时,从不显示边框,而没有超时。如何延迟触发事件?
window.onload = function() {
init();
}
function init() {
for (var i = document.getElementsByTagName("P").length - 1; i >= 0; i--) {
document.getElementsByTagName("P")[i].addEventListener("mouseover", setTimeout(re, document.getElementById("input").innerHTML));
document.getElementsByTagName("P")[i].addEventListener("mouseout", rl);
};
}
function re(e) {
var id=e.target.id;
document.getElementById(id).style.border = "thick solid blue";
}
function rl(e) {
var id=e.target.id;
document.getElementById(id).style.border = "none";
}
3 个解决方案
#1
0
I think as per setTimeout() method the second param should be The number of milliseconds to wait before executing the code
. But looks like in your code that is missing.
我认为根据setTimeout()方法,第二个参数应该是执行代码之前等待的毫秒数。但看起来在您的代码中缺少。
Try to change this line:
尝试更改此行:
document.getElementsByTagName("P")[i].addEventListener("mouseover", setTimeout(re, document.getElementById("input").innerHTML));
to something like below:
如下所示:
document.getElementsByTagName("P")[i].addEventListener("mouseover", setTimeout(re, 1000, document.getElementById("input").innerHTML));
Hope this will resolve the issue!
希望这能解决问题!
#2
0
try:-
document.getElementsByTagName("P")[i].addEventListener("mouseover", function(){
var delay = document.getElementById("input").innerHTML;
setTimeout(re, parseInt(delay));
});
setTimeout
is being invoked when adding the listener, instead of when the event is called.
添加侦听器时调用setTimeout,而不是在调用事件时调用。
#3
0
If you want to get textbox input you have to use id.value instead of id.innerHTML change your code like below:
如果你想获得文本框输入,你必须使用id.value而不是id.innerHTML更改你的代码,如下所示:
window.onload = function() {
init();
}
function init() {
for (var i = document.getElementsByTagName("P").length - 1; i >= 0; i--) {
document.getElementsByTagName("P")[i].addEventListener("mouseover", setTimeout(re(this), document.getElementById("input").value));
document.getElementsByTagName("P")[i].addEventListener("mouseout", rl(this));
};
}
function re(e) {
e.style.border = "thick solid blue";
}
function rl(e) {
e.style.border = "none";
}
#1
0
I think as per setTimeout() method the second param should be The number of milliseconds to wait before executing the code
. But looks like in your code that is missing.
我认为根据setTimeout()方法,第二个参数应该是执行代码之前等待的毫秒数。但看起来在您的代码中缺少。
Try to change this line:
尝试更改此行:
document.getElementsByTagName("P")[i].addEventListener("mouseover", setTimeout(re, document.getElementById("input").innerHTML));
to something like below:
如下所示:
document.getElementsByTagName("P")[i].addEventListener("mouseover", setTimeout(re, 1000, document.getElementById("input").innerHTML));
Hope this will resolve the issue!
希望这能解决问题!
#2
0
try:-
document.getElementsByTagName("P")[i].addEventListener("mouseover", function(){
var delay = document.getElementById("input").innerHTML;
setTimeout(re, parseInt(delay));
});
setTimeout
is being invoked when adding the listener, instead of when the event is called.
添加侦听器时调用setTimeout,而不是在调用事件时调用。
#3
0
If you want to get textbox input you have to use id.value instead of id.innerHTML change your code like below:
如果你想获得文本框输入,你必须使用id.value而不是id.innerHTML更改你的代码,如下所示:
window.onload = function() {
init();
}
function init() {
for (var i = document.getElementsByTagName("P").length - 1; i >= 0; i--) {
document.getElementsByTagName("P")[i].addEventListener("mouseover", setTimeout(re(this), document.getElementById("input").value));
document.getElementsByTagName("P")[i].addEventListener("mouseout", rl(this));
};
}
function re(e) {
e.style.border = "thick solid blue";
}
function rl(e) {
e.style.border = "none";
}