兩個選擇框篩選選項與jquery

我具有由PHP兩個選擇框篩選選項與jquery

<div id="option-264" class="option"> 
     <span class="required">*</span> 
     <b>Board Type:</b><br /> 
     <select name="option[264]" class="optionChoice"> 
      <option value=""> --- Please Select --- </option> 
      <option value="20">All Mountain </option> 
      <option value="21">Straight Jibber </option> 
      <option value="22">Bender </option> 
      <option value="23">Tripod </option> 
     </select> 
    </div> 
    <br /> 
    <div id="option-265" class="option"> 
     <span class="required">*</span> 
     <b>Board Size:</b><br /> 
     <select name="option[265]" class="optionChoice"> 
      <option value=""> --- Please Select --- </option> 
      <option value="17">146      </option> 
      <option value="18">147      </option> 
      <option value="19">149      </option> 
      <option value="24">150      </option> 
      <option value="25">152      </option> 
      <option value="26">153      </option> 
      <option value="27">155      </option> 
      <option value="28">156      </option> 
      <option value="29">157      </option> 
      <option value="30">158      </option> 
      <option value="31">159      </option> 
     </select> 
    </div>

我想隱藏或變灰選項之一的另一取決於當前選擇框的變化選擇產生的兩個選擇框。

即，如果我選擇板類型「直接跳板」，它只能進入「152」「155」和「159」，所以我想隱藏其他所有內容。

希望是有道理的

 function displayVals() { 
     var Values = $("#option-264>select").val(); 
     var Sizes = $("#option-265>select"); 
     switch (Values) { 
    case '20': 
     $("#option-265").fadeOut(); 
     $("#option-265>select option[value='18']").attr("disabled","disabled"); 
     $("#option-265>select option[value='19']").attr("disabled","disabled"); 
     $("#option-265>select option[value='26']").attr("disabled","disabled"); 
     $("#option-265>select option[value='27']").attr("disabled","disabled"); 
     $("#option-265>select option[value='29']").attr("disabled","disabled"); 
     $("#option-265>select option[value='30']").attr("disabled","disabled"); 
     $("#option-265").fadeIn(); 
     break; 
    case '21': 
     $("#option-265").fadeOut(); 
     $("#option-265>select option[value='18']").attr("disabled","disabled"); 
     $("#option-265>select option[value='24']").attr("disabled","disabled"); 
     $("#option-265>select option[value='26']").attr("disabled","disabled"); 
     $("#option-265>select option[value='28']").attr("disabled","disabled"); 
     $("#option-265>select option[value='30']").attr("disabled","disabled"); 
     $("#option-265").fadeIn(); 
     break; 
    case '22': 
     $("#option-265").fadeOut(); 
     $("#option-265>select option[value='18']").attr("disabled","disabled"); 
     $("#option-265>select option[value='24']").attr("disabled","disabled"); 
     $("#option-265>select option[value='26']").attr("disabled","disabled"); 
     $("#option-265>select option[value='28']").attr("disabled","disabled"); 
     $("#option-265>select option[value='30']").attr("disabled","disabled"); 
     $("#option-265").fadeIn(); 
     break; 
    case '23': 
     $("#option-265").fadeOut(); 
     $("#option-265>select option[value='18']").attr("disabled","disabled"); 
     $("#option-265>select option[value='24']").attr("disabled","disabled"); 
     $("#option-265>select option[value='26']").attr("disabled","disabled"); 
     $("#option-265>select option[value='28']").attr("disabled","disabled"); 
     $("#option-265>select option[value='30']").attr("disabled","disabled"); 
     $("#option-265").fadeIn(); 
     break; 
    case '': 
     $("#option-265").fadeOut(); 
     break; 
} 
} 
$("#option-264>select").change(displayVals); 
displayVals();

我砍死了這個辦法和排序的得到它的工作（有見過的最醜陋的代碼IV）ID喜歡，如果我可以隱藏的選項不只是灰色出來，雖然。

來源

2012-03-19 Mitchell Bray

的http：// mattgemmell.com/2008/12/08/what-have-you-tried/ – 2012-03-19 05:59:17

不，這沒有任何意義。 – mowwwalker 2012-03-19 06:00:15

這樣的事情？

$('select[name="option[264]"]').change(function(value) { 
    var selected = $(this).children('option:selected').val(); 

    //hide all options 
    $('select[name="option[265]"] option').hide(); 

    //show options based on initial selection 
    if (selected == 20) { 
     $('select[name="option[265]"]').find('option:contains("152"), option:contains("155"), option:contains("159")').show(); 
    } else if (selected == 21) { 
     //etc etc 
    } 
});

絕對不是最優雅的解決方案，我承認。

來源

2012-03-19 06:46:05 tobias86

不錯，我認爲選項：包含將真正幫助我整理它thnks – 2012-03-19 07:04:03

其實我沒有得到正確ü但..我的理解u有變化之後，即將dyanamicallyü要其值設置爲隱藏選擇框，顯示等。

<script type="text/javascript"> 
     jQuery(document).ready(function(){ 

    jQuery('#id_name_ur').change(function() { 

      if(jQuery('#Idname option:selected').val() != ''){ 

$(this).hide(); 
        //like this u can got ur solutions ... 
    // put ur code here 
        alert("you selected an option"); 
    return true; 
       }else{ 
    alert("please select an option"); 
    return false; 
    } 


    }); 

     }); 
    </script>

來源

2012-03-19 06:47:37

兩個選擇框篩選選項與jquery

回答

相關問題