javascript - Jquery 显示和隐藏函数

Question

我试图让它发挥作用，当他们在日期之间选择搜索时，它将显示第二个日期搜索字段。

我知道 jquery 正在为选择菜单提取该值，因为我可以为其设置警报，当我单击日期之间的搜索时，它会向我发出警报，我唯一的问题是让它显示隐藏输入。

HTML:

<select name='filter' class='input-large' id="select_field">
    <option value=''>Select One</option>
    <option value='dateonly'>Search by Date Only</option>
    <option value='search_between_dates'>Search Between Dates</option>
</select>
<input type='text' placeholder="Date">
<input type="text" placeholder="Date 2" id="date2_hiddden" class="hidden">

Javascript:

function getSelect() {
    var selectValue = $("#select_field").val();
    if(selectValue === 'search_between_dates') {
        $("#date2_hidden").show(function() {
            $("#date2_hidden");
        })
    } else {
        $("#date2_hidden").hide();
    }
}
$("#select_field").change(getSelect);
getSelect();

这些都不起作用，并且将 id 而不是类放在第二个仍然不起作用。

function getSelect() {
    var selectValue = $("#select_field").val();
    if(selectValue === 'search_between_dates') {
        $(".hidden").show();
    } else {
        $("#date2_hidden").hide();
    }
}
$("#select_field").change(getSelect);
getSelect();

Answer 1

我注意到您的 HTML 有 date2_hidden 和 3 个“d”。

这是一个工作示例:http://jsfiddle.net/H6Hhw/1/

function getSelect() {    
    var selectValue = $("#select_field").val();

    if (selectValue === 'search_between_dates') {
        $("#date2_hidden").show();
    } else {
        $("#date2_hidden").hide();
    }
}

$("#select_field").on('change', function () {
    getSelect();
});