jQuery顯示/隱藏div下拉更多級別

我現在正在尋找解決方案顯示/隱藏divs包括下拉菜單，取決於所選值的2天。jQuery顯示/隱藏div下拉更多級別

這就是我試圖至今：

$(document).ready(function() { 

$("#auswahl_lkw").hide(); 
$("#auswahl_raupen").hide(); 
$("#auswahl_teleskopstapler").hide(); 
$("#auswahl_bagger").hide(); 
$("#auswahl_gelenk_antrieb").hide(); 
$("#auswahl_gelenk_elektro").hide(); 
$("#auswahl_gelenk_diesel").hide(); 
$("#auswahl_scheren_antrieb").hide(); 
$("#auswahl_scheren_elektro").hide(); 
$("#auswahl_scheren_diesel").hide(); 

$("#auswahl_hebebuehnen").change(function() { 
    if ($("#auswahl_hebebuehnen").val() == "LKW-Hebebühnen") { 
     $("#auswahl_lkw").show(); 

    } 
    else { 
     $("#auswahl_lkw").hide(); 

    } 

    if ($("#auswahl_hebebuehnen").val() == "Gelenkteleskopbühnen") { 
     $("#auswahl_gelenk_antrieb").show(); 

    } 
    else { 
     $("#auswahl_gelenk_antrieb").hide(); 

    } 


    if ($("#auswahl_hebebuehnen").val() == "Raupenhebebühnen") { 
     $("#auswahl_raupen").show(); 

    } 
    else { 
     $("#auswahl_raupen").hide(); 

    } 

    if ($("#auswahl_hebebuehnen").val() == "Scherenhebebühnen") { 
     $("#auswahl_scheren_antrieb").show(); 

    } 
    else { 
     $("#auswahl_scheren_antrieb").hide(); 

    } 

    if ($("#auswahl_hebebuehnen").val() == "Teleskopstapler") { 
     $("#auswahl_teleskopstapler").show(); 

    } 
    else { 
     $("#auswahl_teleskopstapler").hide(); 

    } 

    if ($("#auswahl_hebebuehnen").val() == "Bagger") { 
     $("#auswahl_bagger").show(); 

    } 
    else { 
     $("#auswahl_bagger").hide(); 

    } 
});  
});

此代碼的工作相當不錯的1級，但對：

if ($("#auswahl_hebebuehnen").val() == "Gelenkteleskopbühnen") { 
     $("#auswahl_gelenk_antrieb").show(); 

    } 
    else { 
     $("#auswahl_gelenk_antrieb").hide(); 

    }

則顯示#auswahl_gelenk_antrieb下拉，在那裏你可以選擇2個選項（取決於該選項）應該在下面顯示另一個div #auswahl_scheren_elektro或#auswahl_scheren_diesel。

該HTML代碼是從聯繫表單7插件Wordpress，它應該沒問題，因爲代碼適用於1.級別。

我希望有人能給我一個有用的提示。

來源

2013-10-23 user2910229

istead歡迎來到堆棧溢出！請你可以編輯你的問題，並添加所有相關的代碼，始終重現問題？這個JavaScript運行的'HTML'和'CSS'丟失了。 – andyb

$("#auswahl_lkw").hide(); 
$("#auswahl_raupen").hide(); 
$("#auswahl_teleskopstapler").hide(); 
$("#auswahl_bagger").hide(); 
$("#auswahl_gelenk_antrieb").hide(); 
$("#auswahl_gelenk_elektro").hide(); 
$("#auswahl_gelenk_diesel").hide(); 
$("#auswahl_scheren_antrieb").hide(); 
$("#auswahl_scheren_elektro").hide(); 
$("#auswahl_scheren_diesel").hide();

這^

$('.hidden_divs').hide();// give all divs a common class. and give them different ids `//according to the value of the select box;` 


//$("#auswahl_hebebuehnen") << its a select box i think 

$("#auswahl_hebebuehnen").change(function() { 
$('.hidden_divs').hide(); 
$('#'+$(this).val()).show(); 
});

HTML例如

<div class="hidden_divs" id="LKW-Hebebühnen"></div> 
<div class="hidden_divs" id="Gelenkteleskopbühnen"></div> 
<div class="hidden_divs" id="Raupenhebebühnen"></div>

即使它的動態，生成的ID和期權值並不複雜...

來源

2013-10-23 07:55:27

jQuery顯示/隱藏div下拉更多級別

回答

相關問題