重置值或设置为默认的选定选项jQuery

时间:2019-07-30 19:40:51

标签: javascript jquery html twitter-bootstrap

我正在尝试重置最近选择选项的值。

$(document).ready(function () {
    $('.limitation_points').hide();
    $('.field .limitSelected').each(function () {
        $(this).change(function () {
            var selected = $(this).val();
            if (selected == '1') {
                $(this).closest('.field').find('.limitation_points').fadeIn(200);
            } else {
                $(this).closest('.field').find('.limitation_points').fadeOut(200);
                $(this).closest('.field').find('input[name="pillers[]"]').val("");
            }
        });
    });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="field">
    <input id="limitation1" type="radio" class="limitSelected" name="limitation" value="1" />Yes
    <input id="limitation2" type="radio" class="limitSelected" name="limitation" value="0" />No       
    <select id="pijlers" class="pillers" name="pillers[]">
        <option class="placeholder" selected disabled>Make Choice</option>
        <option value="0">0</option>
        <option value="1">1</option>
    </select>
</div>

直到fadeIn fadeOut我的代码正在按应有的方式工作。但是,当值的值为“ 0”时,此代码不会重置选择选项的值。

有人可以帮助我吗,我在这里做错了吗?

谢谢。

2 个答案:

答案 0 :(得分:1)

使用“ -1”作为默认值,并使用 select 代替 input 作为选择器,应该可以解决问题。

$(document).ready(function () {
    $('.limitation_points').hide();
    $('.field .limitSelected').each(function () {
        $(this).change(function () {
            var selected = $(this).val();
            if (selected == '1') {
                $(this).closest('.field').find('.limitation_points').fadeIn(200);
            } else {
                $(this).closest('.field').find('.limitation_points').fadeOut(200);
                $(this).closest('.field').find('select[name="pillers[]"]').val("-1");
            }
        });
    });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="field">
    <input id="limitation1" type="radio" class="limitSelected" name="limitation" value="1" />Yes
    <input id="limitation2" type="radio" class="limitSelected" name="limitation" value="0" />No       
    <select id="pijlers" class="pillers" name="pillers[]">
        <option class="placeholder" value="-1" selected disabled>Make Choice</option>
        <option value="0">0</option>
        <option value="1">1</option>
    </select>
</div>

答案 1 :(得分:0)

value属性添加到默认<option>并删除disabled

使用空字符串重置时,没有匹配的选项

<option value="" class="placeholder" >Make Choice</option>