jquery 테이블에 여분의 드롭 다운을 숨기기

Question

각 테이블에 여러 개의 드롭 다운이 가능한 여러 개의 테이블이 페이지에 있습니다. 테이블과 드롭 다운은 자동으로 생성됩니다. 대상으로하려는 테이블에는 숫자 ID가 있으며 드롭 다운의 모든 값은 숫자입니다. 내가하고 싶은 테이블 중 하나에 대한

HTML 샘플 코드 대상에 테이블의 드롭 다운 중 하나가 내가 다른 드롭 다운을 숨기고 싶은 선택되면

<table id="15"> 
<tr> 
    <td> 
    <div id="dd_4_0"> 
    <select id="4_0"> 
    <option value=""></option> 
    <option value="18">VNDR64324</option> 
    <option value="21">MFG5321</option> 
    <option value="27">OTHER</option> 
    </select> 
    </div> 
    </td> 
</tr> 
<tr> 
    <td> 
    <div id="dd_2_6"> 
    <select id="2_6"> 
    <option value=""></option> 
    <option value="12">VN32R2345</option> 
    <option value="21">5678</option> 
    <option value="27">NEM</option> 
    </select> 
    </div> 
    </td> 
</tr> 
</table> 

. 작동하는 코드가 있지만 가능한 경우 수행하지 않고 루프를 반복하는 코드가 많이 있습니다. 이것을 작성하는 더 깨끗한 방법이 있습니까?

$('table').click(function() { 
    if($.isNumeric(this.id)) 
     dd = $("#" + this.id + " select"); 
     $.each(dd, function(){ 
      if($.isNumeric($(this).val())) 
      { 
       selectedId = this.id; 
       $.each(dd, function(){ 
        if(this.id != selectedId) 
         $('#dd_' + this.id).hide(); 
       }); 

      } 
     }); 
}); 

Answer 1

I는 관련 테이블에 공통 클래스를 추가하고 이런 짓을 했을까 : 테이블의 드롭 다운 중 하나가 선택되면

$(".table_class select").change(function(){ 
    var $this = $(this); 

    if($this.val() != ""){ 
     $this.closest(".table_class").find("select").not($this).hide(); 
    } else { 
     // if you want, re-show them if the select is de-selected 
     $this.closest(".table_class").find("select").show(); 
    } 
}); 

Answer 2

내가 다른 드롭 다운을 숨길하고 싶습니다.

난 당신 그러나 가장 짧은 방법을 (내가 생각할 수 있다는 ..) 그러나이

$('select').change(function(){ 
    $(this).parents('tr').find('select').not($(this)).hide(); 
}); 

을 시도 select

의 change() 이벤트를 호출합니다 얻으면 내가 모르는

이 옵션은 문서에있는 모든 선택 요소를 선택합니다. 테이블 외부 또는 페이지의 다른 곳에서 다른 선택 요소가 없다고 확신하는 경우 ... 작동해야합니다. 그렇지 않으면 각 클래스에 클래스를 추가 할 수 있습니다 해당 테이블에 대한 테이블 및 호출 선택기 만 선택하십시오 ...

working fiddle here