0

我现在正在搜索 2 天的解决方案来显示/隐藏 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. Level 中工作得非常好，但是对于：

    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 代码来自 Contact form 7 Plugin Wordpress，应该没问题，因为该代码适用于 1. 级别。

我希望有人能给我一个有用的提示。

泰

4

1 回答 1

1 
$("#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();
});

示例

<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-23T07:55:27.003 回答