Javascript Jquery从选择框隐藏/显示div不起作用，我不知道为什么？

我有以下jQuery：

<script>
    $(document).ready(function () {
        $(".search_type").hide();
        $("#select_search").change(function () {
            $('#' + $(this).val()).toggle();
        });
    });
</script>
<select id="select_search">
      <option value="1">
      <option value="2">
      <option value="3">
 </select>
 <div id="1" class="search_type">Some Text</div>
 <div id="2" class="search_type">Some Text</div>
 <div id="3"class="search_type">Some Text</div>
enter code here

目前，我让它根据选择框的更改显示相应的div，但是，如果再次更改选择框，则不会删除它

---

是否有一个if$this:not.val…..隐藏的东西？抱歉，我是JS/jQuery新手，我在这里真的很挣扎。

不，但你可以这样做：

$(document).ready(function () {
    $(".search_type").hide();
    $("#select_search").change(function() {
        $(".search_type").hide();
        $("#" + $(this).val()).show();
    });
});

这将隐藏类搜索类型的所有元素，然后显示所选内容

还可以创建占位符变量，如下所示：

var showing;

$(document).ready(function () {
    $(".search_type").hide();
    $("#select_search").change(function() {
        if (showing) {showing.hide();}
        showing = $("#" + $(this).val());
        showing.show();
    });
});

---

您需要隐藏以前显示的元素，这是一种简单的方法，可以再次隐藏所有搜索类型的元素，然后使用更改处理程序显示当前元素

jQuery(function ($) {
    var $stypes = $(".search_type").hide();
    $("#select_search").change(function () {
        $stypes.hide();
        $('#' + $(this).val()).show();
    }).change();
});

---

演示：

我对您的问题有点不清楚，但我可以告诉您，您希望显示一个DIV，该DIV与用户在选择框中的选择相对应。如果用户选择了一个不同的选项，您想隐藏先前的显示框，对吗

我认为此示例将帮助您：

存在一个$.not对象方法，该方法将对任何与您提供的对象不匹配的对象执行操作。请参阅下面的代码：

$("#select_search").change(function () {
    var activeBox = $('#' + $(this).val());
    activeBox.show();

    $('div').not(activeBox).hide();                
 });

---

请共享相关的htmlYour占位符变量示例将不起作用，带有showing.hide的行将给出一个关于显示未定义的错误，并在显示所选项目之前停止。另外，将var-showing声明放在documentready处理程序中会更整洁，无需使其全局化。