jQuery顯示/隱藏一個選擇下拉選項，當其他選擇下拉選項被選中而不改變當前選項

-2

這裏的一個複雜的位，不知道是否有可能。jQuery顯示/隱藏一個選擇下拉選項，當其他選擇下拉選項被選中而不改變當前選項

下面是一段jQuery，其中顯示/隱藏選擇下拉選項依賴於另一個選擇下拉選項。該代碼是由一位成員在此寫回復前一個問題的。

該代碼有效地隱藏了'layout_select'中的選項，取決於'column_select'中選擇的選項。然而，如果我選擇

3欄+佈局4

在按下保存按鈕的頁面重新加載和所選擇的選項將變爲佈局3一次。如果我選擇

3列+佈局5或2列+佈局2

我需要jQuery來保持在刷新時選擇正確的選項同樣的情況。

這是我到目前爲止有：

<select name="column_select" id="column_select"> 
    <option value="col1">1 column</option> 
    <option value="col2">2 column</option> 
    <option value="col3">3 column</option> 
</select> 

<select name="layout_select" id="layout_select"> 
    <!--Below shows when '1 column' is selected is hidden otherwise--> 
    <option value="col1">none</option> 

    <!--Below shows when '2 column' is selected is hidden otherwise--> 
    <option value="col2_ms">layout 1</option> 
    <option value="col2_sm">layout 2</option> 

    <!--Below shows when '3 column' is selected is hidden otherwise--> 
    <option value="col3_mss">layout 3</option> 
    <option value="col3_ssm">layout 4</option> 
    <option value="col3_sms">layout 5</option> 
</select>

jQuery的：

$(document).ready(function() { 
    var optarray = $("#layout_select").children('option').map(function() { 
     return { 
      "value": this.value, 
      "option": "<option value='" + this.value + "'>" + this.text + "</option>" 
     } 
    }) 

    $("#column_select").change(function() { 
     $("#layout_select").children('option').remove(); 
     var addoptarr = []; 
     for (i = 0; i < optarray.length; i++) { 
      if (optarray[i].value.indexOf($(this).val()) > -1) { 
       addoptarr.push(optarray[i].option); 
      } 
     } 
     $("#layout_select").html(addoptarr.join('')) 
    }).change(); 
})

演示 - http://jsfiddle.net/N7Xpb/1/

我由JavaScript困惑所以任何幫助將不勝感激。

來源

2011-10-08 Nick

我的建議是使用JQuery的cookie插件在cookie中存儲選定的值（在選擇選項更改後）。

然後，在$（document）.ready（）中，可以從這些存儲值中設置每個選擇選項。

來源

2011-10-08 20:57:52

jQuery顯示/隱藏一個選擇下拉選項，當其他選擇下拉選項被選中而不改變當前選項

回答

相關問題