事件监听器循环

我该如何添加一个监听器来悬停在这样的div标签上：事件监听器循环

| btn1 | btn2 | btn3 | btn4 |

我想添加一个侦听器，通过它们循环，就像我在下面显示，然后应用一个函数，如果它有鼠标悬停。

function listen() { 
for (i=1;i<=10;i++) { 
    wat = document.getElementById('btn'+i); 
    wat.addEventListener('mouseover',functionwat,false); 
} 
}

我有这一点，它不工作了，是它被调用函数听（），因为我在那里加一个警告的事，以确保其正常工作，functionwat作品的权利了。任何想法我做错了？

来源

2010-02-18 David

是'范围functionwat'？ – 2010-02-18 01:30:24

对不起，我不知道范围是什么，但它是正确的听（）函数 – David 2010-02-18 01:31:52

大卫，请阅读并再次回复：http：//en.wikipedia.org/wiki/Scope_%28programming%29 – 2010-02-18 01:34:00

而是循环的每个项目和附加事件的重视的情况下，考虑实现事件代表团。由于涉及您的情况，让假设你使用jQuery，并为您的跟随按钮的标记：

<div id="btnList"> 
<button id="btn1">btn1</button> 
<button id="btn2">btn2</button> 
<button id="btn3">btn3</button> 
<button id="btn4">btn4</button> 
</div>

的JavaScript：

$(document).ready(function() 
{ 
    $("#btnList button").bind(
      "mouseenter mouseleave", 
      function(e) { 
      //do something based on target/id 
      alert(this.id); 
      }); 
});

来源

2010-02-18 02:38:40 VajNyiaj

为什么假设他使用jQuery？ jQuery就像Javascript中的另一种语言。 – levik 2010-02-18 05:33:25

你使用什么浏览器？注册事件处理程序是不同的浏览器到浏览器。 PPK对浏览器事件here有一些很好的讨论。

简而言之，这是用于添加处理程序的跨浏览器代码。

function addEventSimple(obj,evt,fn) { 
    if (obj.addEventListener) 
     obj.addEventListener(evt,fn,false); 
    else if (obj.attachEvent) 
     obj.attachEvent('on'+evt,fn); 
}

现在你可以用

function listen() { 
    for (i=1;i<=10;i++) { 
     wat = document.getElementById('btn'+i);  
     addEventSimple(wat, 'mouseenter', functionwat); 
    } 
}

来源

2010-02-18 01:34:43 Joel

好的尝试了这一点，仍然没有运气。我把addeventsimple函数上面的函数listen（）正确吗？ – David 2010-02-18 01:39:27

看来，你可能会与你的变量有点凌乱。例如，您不使用var来声明i，所以它可能会在全局名称空间中结束。在此之后，你确定functionwat真的是listen()执行时的一个函数吗？

您可以通过检查;

function listen() { 

    if(typeof functionwat !== "function") { 
     alert("functionwat is not a function, but a " + typeof functionwat); 
    } 

    for (var i = 1; i <= 10; ++i) { 
     wat = document.getElementById("btn"+i); 
     wat.addEventListener("mouseover", functionwat, false); 
    } 
}

来源

2010-02-18 03:06:23 relluf

大卫，

你的运气不好，因为我是你使用的浏览器是不是IE几乎可以肯定。您的事件不会在非IE浏览器中触发，因为事件“mouseenter”仅在IE中暴露。要使其工作，您需要更改“mouseenter”以使用“mouseover”。

function listen() { 
    for (i=1;i<=10;i++) { 
     wat = document.getElementById('btn'+i);  
     addEventSimple(wat, 'mouseenter', functionwat); 
    } 
}

到

function listen() { 
    for (i=1;i<=10;i++) { 
     wat = document.getElementById('btn'+i); 
     if(wat) { addEventSimple(wat, 'mouseover', functionwat); } 
    } 
}

来源

2010-02-19 07:20:40 VajNyiaj

事件监听器循环

回答

相关问题