하나의 이벤트 핸들러를 여러 요소에 할당합니까?

Question

좋아요, 제안 된 q/a를 완료했지만 분명히 또는 전혀 대답하지 않은 것 같습니다.

난 혼란을 줄이고 하나의 이벤트 처리기를 별도로 처리하지 않고 여러 이미지에 동시에 할당하고 싶습니다.

$(document).ready(function(){ 

     $("#div1 img:eq(0)").mouseenter(function(){ 
        $(this).css("border","1px solid green"); 
    }) 

     $("#div1 img:eq(1)").mouseenter(function(){ 
        $(this).css("border","1px solid green); 
    }) 

     $("#div1 img:eq(2)").mouseenter(function(){ 
     $(this).css("border","1px solid green"); 
    }) 

}) 내가 좋아하는 일을 한 적이 있습니다 자바 스크립트를 일반에

: 이것은 반복적 인 코드 현재 코드

div1imgs=documentGetElementById("div1").getElementsByTagName("img"); 

for(i=0; i<div1imgs.length; i++) { 
div1imgs[i].onmouseover=function(){this.style.border="1px solid green"} 

그것은 단지를 사용하는 유혹,하지만 난 ' jquery에 들어가서 jquery를 유지하는 것을 선호합니다. 거기에 jquery, 거기에 해당하는 솔루션을 좀 더 단순한 이벤트 그룹을 동시에 이미지 그룹에 할당합니다? 또한 루프를 사용하거나 그렇지 않으면?

Answer 1

당신의 바닐라 JS 버전에 기초하여,이 것 :

$("#div1 img").mouseenter(function() { 
    $(this).css("border","1px solid green"); 
}); 

참고 여러 요소에 이벤트를 바인딩 jQuery를 사용하는 경우, 자동으로 각각의 요소를 통해 루프 바인딩을 수행 할 것입니다.