2011-10-27 2 views
0

목록의 요소가 있고 목록에서 요소를 선택하면 코드의 "value"가 변경됩니다.목록에서 요소를 선택할 때 jquery로 동적 요소 추가

<div class="drop-down-cont zi-5 fleft"> 
      <input class="dd-input" id="packaging_item_packaging_name" name="packaging_item[packaging_name]" title="Packaging Type" type="hidden" value="PX"> 
      <a class="drop-down-link item-qnt" href="#" id="packaging_item_packaging_name_link">Pallet</a> 
      <div class="drop-down pic" style="visibility: visible; "> 
      <div class="blue-tarr"></div> 
      <div class="drop-down-list-cont w400"> 
       <div class="drop-down-list first pt-cases w100p" id="cases_results_"><ul class="w100p"> 

<li id="PX" class="selected"> 
    <a href="javascript:void(0)">Pallet</a> 
</li> 
<li id="PB"> 
    <a href="javascript:void(0)">Pallet Box</a> 
</li> 
<li id="PLP"> 
    <a href="javascript:void(0)">Peel pack</a> 
</li> 

</ul> 



</div> 
       <div class="pic-cont h100p"><img alt="Package Image" src="/images/pi_new/32.jpg?1312107854"> </div> 
      </div> 
      <div class="remark"> 
A platform used to hold or transport unit loads. 

</div> 
      <a class="submit-btn2 pt-choose-btn-" href="javascript:void(0)" id="pack_apply">Apply</a> 
      </div> 
     </div> 

<table id="pallet_table" style="display:none;"> 
    <tbody> 
     <tr> 
     <td> 
      stacking factor: 
     </td> 
     <td> 
      <input class="w44" id="packaging_item_stacking_factor" name="packaging_item[stacking_factor]" size="30" type="text" value="1"> 
     </td> 
     </tr> 
    </tbody> 
    </table> 

은 내가 'PX'에서 '가치'를 선택하고이 스크립트를 실행할 때,

if ($('.dd-input').attr('value') == 'PX') { 
    $('#pallet_table').show();} 

을 테이블을 보여주고 싶은하지만이이 동적으로 작동하지 않습니다. 나는 '무엇이든지'에서 'PX'이이 문제를 해결해야

+0

붙여 넣은 HTML에서 내 목록을 볼 수 없습니다. 무슨 사건을 일으키고 싶니? –

+0

이것은 중요하지 않습니다. 다른 파일의 드롭 다운 목록이지만, 일부 요소를 선택하면

+0

@ MikhailAleksandrovi4 : 이것은 중요합니다. 당신은 구체적이지 않습니다. 이벤트를 드롭 다운 목록에 바인딩 할 수 있다면 그렇게하는 것이 더 쉽고 빠릅니다. – Tadeck

답변

0

에 값을 변경 한 후이 이벤트를 처리 할 수있는 방법 (this jsfiddle 참조)

jQuery('.dd-input').bind('change', function(){ 
    if (jQuery(this).val() == 'PX'){ 
     // do here whatever you need 
     $('#pallet_table').show(); 
    } 
}); 

내가 그러나이 표시되지 않습니다, 당신은 싶습니다 방법 사용자가이 필드의 값을 변경하려면 (코드에서 필드가 숨겨져 있음). 이 작업이 다른 스크립트를 통해 수행된다면 현재의 방법이 최선의 방법이 아니며 값이 변경되었을 때 명시 적으로 수행하는 대신 명시 적으로 일부 함수를 호출해야합니다.

+0

이 코드는 잘 작동하지만 http://jsfiddle.net/Uur9A/16/, 내 컨텍스트에서는이 솔루션이 작동하지 않습니다. 나는이 이벤트가 submit하기 전에 실행 되어야만하는 폼을 가지고있다. –

+0

@ MikhailAleksandrovi4 : 무언가가 제출되기 전에 코드를 실행할 수있는 많은 방법이있다 - 당신은'submit' 이벤트를 가로 챌 수 있고, [AJAX 콜을 미리 필터링 할 수있다] (http : // api. jquery.com/jQuery.ajaxPrefilter/). 정말로, "_ 할 수 없다"는 말은 가능한 해결책을 과소 평가 한 결과입니다. – Tadeck

+0

예 이전 목록을 사용할 수있었습니다. 여기에서 요소 목록에서 선택합니다. –