將多個選擇框選項鍊接到單個選擇

Question

我正在使用jquery插件jquery.chained.js的修改版本來篩選出基於另一個選擇框的選擇框選項和複選框。但是，現在我需要根據以前的選擇框中的2個選項來過濾選擇框。

我有3個選擇框。

1. 員工
2. 客房
3. 服務

和幾個複選框或選擇盒

• 附加組件

上述插件取決於偏好ŧ o將其顯示爲複選框或下拉菜單

如果您更改Staff，那麼Services和Addons選項將更改爲員工有權訪問的服務。然而，我現在需要做到這一點，以便Services和Addons將基於什麼Staff有權訪問那些Services以及什麼Rooms提供這些服務。

是否有人能夠幫助我修改這個已經修改的腳本來添加對多個選擇框的支持？我想盡量保持它的通用性，因爲我們可能也會使用此鏈接腳本來處理其他元素。

總結我正在尋找的是添加對Rooms選​​項框的支持以進一步過濾服務和AddonServices選項。

實施例的代碼可以發現http://bit.ly/uzEDL2

編輯：checkboxradio（）是用於移動的jquery所以不用擔心那些。

Answer 1

要讓孩子選擇取決於兩個父母的值使用類名如first\second。請注意，如果你有非常複雜的選擇結構，維護這種類將會變得麻煩。在這種情況下，使用插件的遠程版本可能會更容易。

取自plugin documentation的示例。在這個例子中，柴油發動機僅適用於寶馬3和5系列轎車。這是通過使用類名稱series-3\sedan和series-5\sedan來實現的。

<select id="series"> 
    <option value="">--</option> 
    <option value="series-3" class="bmw">3 series</option> 
    <option value="series-5" class="bmw">5 series</option> 
    <option value="series-6" class="bmw">6 series</option> 
    <option value="a3" class="audi">A3</option> 
    <option value="a4" class="audi">A4</option> 
    <option value="a5" class="audi">A5</option> 
</select> 

<select id="model"> 
    <option value="">--</option> 
    <option value="coupe" class="series-3 series-6 a5">Coupe</option> 
    <option value="cabrio" class="series-3 series-6 a3 a5">Cabrio</option> 
    <option value="sedan" class="series-3 series-5 a3 a4">Sedan</option> 
    <option value="sportback" class="a3 a5">Sportback</option> 
</select> 

<select id="engine"> 
    <option value="">--</option> 
    <option value="25-petrol" class="series-3 a3 a4">2.5 petrol</option> 
    <option value="30-petrol" class="series-3 series-5 series-6 a3 a4 a5">3.0 petrol</option> 
    <option value="30-diesel" class="series-3\sedan series-5\sedan a5">3.0 diesel</option> 
</select> 

$("#model").chained("#series"); 
$("#engine").chained("#series, #model"); 

請注意，您的HTML無效。單號不是有效的類名。類名必須以下劃線字母[a–z]開頭，下劃線[_]或破折號[-]，然後是數字，字母，下劃線和破折號。更好的解釋可以從：Allowed characters for CSS identifiers找到。