2011-01-09 3 views
0

나는 버튼의 긴 목록을 가지고 : <input type=button name=clickbutton onclick='dosomething(this)'>지정된 이름으로 입력 버튼을 보는 방법은 무엇입니까? 예를 들어

하지만 그 대신 모든 버튼에 같은 ​​funcion에 전화를 넣는는이 이름으로 그 버튼의 클릭을 기다리는 것이 하나의 청취 이벤트를 추가하는 것이 더 합리적 일 것 . 하지만 다시 한 번이 버튼이 있습니다. 따라서 함수에 클릭 된 객체를 전달해야합니다. 예를 들어,이 함수는이 버튼에 인접한 nextSibling 인 텍스트 영역을 업데이트해야합니다.

답변

1

이벤트 위임을 조회합니다. 이것은 당신이 필요로하는 것일 수 있습니다. Google에는 많은 리소스가 있습니다.

업데이트 :이 미안 해요, 난 대답에 좀 더 노력을 듯했으나, 여기에서 당신은 다음 이벤트에 따라 수행해야 할 작업을 결정하기 위해 스위치를 사용하는 것이 Google Search...

일부 결과는 .name 특성. 이러한 접근 방식에 대한 멋진 점은 이벤트가있는 페이지에 많은 요소가있는 경우 사용자가하는 것처럼 들리지만 페이지의 응답 성을 높여야한다는 것입니다. 브라우저가 요소 당 이벤트에 대한 추가 오버 헤드를 처리 할 필요가 없기 때문입니다.

1
var buttons = document.getElementsByName('clickbutton'); 
for (var i = 0; i < buttons.length; i++) 
    buttons[i].onclick = function(){ 
     this.nextSibling.innerHTML = 'clicked!'; 
    } 
3

당신은 jQuery를 사용할 수 있습니다

$('input[name|="clickbutton"]').click(function() { 

    var currentButton = $(this); 
    alert(currentButton.attr('id')); 

}); 

이것은 'clickbutton'의 이름으로 모든 입력 요소에 클릭 기능을 첨부합니다. currentButton은 방금 클릭 한 입력 요소입니다. 이 함수는 currentButton의 ID를 알려줍니다.

UPDATE : I했습니다 여기 당신을 위해 작업 예제 작성 : http://jsfiddle.net/Damien_at_SF/cdsWk/1/

희망하는 데 도움이 :