只有最后一项绑定点击/悬停事件？

我是一个JavaScript的新手& HTML5。我遍历一组名为请求的对象并为它们创建div。我试图让它如此，如果任何项目都悬停在样式类更改上，并且如果点击它们，我稍后将调用一个函数，但现在只需要一个警报。只有最后一项得到它。只有最后一项绑定点击/悬停事件？

我已经看过其他人看起来像是类似的问题，但我看不出我要去哪里。

 for (i= 0; i<reqs.length; i++) { 
      var requestID = "request"+i; 
      // Build the DIV for each request 
      element.innerHTML += "<div id="+requestID+" class=request><img class=requestImage src=images/" 
       +reqs[i].image+" alt=Face />&nbsp;&nbsp;"+reqs[i].name+"</div>"; 

      var requestElement = $('#'+requestID); 
      requestElement.hover(
       function() { 
        $(this).removeClass().addClass("requestHover"); 
        }, 
       function() { 
       $(this).removeClass().addClass("request"); 
       } 
      ); 
      requestElement.click(
      // if the request is clicked, then alert me - testing 
       function() { 
        alert('Handler for .click() called.'); 
       } 
      ); 

     }// end for

从我的理解的$（“＃request1”）应引用第一个div项目，$（“＃请求2”）第二，等它的行为就像每个.hover和分配。点击覆盖前一个。

来源

2011-09-07 Driss Zouak

您可能被封闭相关的错误所占用。请为此代码提供更多范围（任何封闭函数？）。 – Jon

我这样

for (i= 0; i<reqs.length; i++) { 
     var requestID = "request"+i; 
     // Build the DIV for each request 
     element.innerHTML += "<div id="+requestID+" class=request><img class=requestImage src=images/" 
      +reqs[i].image+" alt=Face />&nbsp;&nbsp;"+reqs[i].name+"</div>"; 
    }// end for 
    var requestElement = $(".request"); 
    requestElement.hover(
     function() { 
      $(this).removeClass().addClass("requestHover"); 
     }, 
     function() { 
      $(this).removeClass().addClass("request"); 
     } 
    ); 
    requestElement.click(
     // if the request is clicked, then alert me - testing 
     function() { 
     alert('Handler for .click() called.'); 
     } 
    );

编辑写来回答您的评论：

不，这是关闭的问题。在循环结束时，requestID总是相同的，所以$("#"+requestID);总是相同的。它只有一个绑定。

为了克服这样的事情，你有一些选择：

使用$。每次循环（见http://forum.jquery.com/topic/binding-event-to-element-dynamically，http://forum.jquery.com/topic/binding-click-event-in-a-loop，http://api.jquery.com/jQuery.each/）
使用live()方法（见http://api.jquery.com/live/，http://jsfiddle.net/VrzUb/1/（用于点击））
归功于每个对象共有的选择器（例如，使用类，如上）分配事件

来源

2011-09-07 11:39:12

有没有什么我在句法上做错了尝试获取ID字段与＃请求+我？为了提高我的理解。 –

见编辑答案。 –

您可以在for循环分配事件侦听器，也许这解决您的问题：

for (...) { 
} 

$('div.request').hover(...);

来源

2011-09-07 11:37:14 Niko

这工作对我来说，请参阅http://jsfiddle.net/4VUxA/ – GregL

只有最后一项绑定点击/悬停事件？

回答

相关问题