首页 > 解决方案 > 模态事件关闭后如何使切换选项恢复默认值?

问题描述

模态事件关闭后如何使切换选项恢复默认值?我正在尝试使用prop checked,但它不起作用。

在下面尝试过,但不起作用。

  1. $('#on').prop('checked');
  2. $('#on').prop('checked', false);
  3. $('#off').prop('checked', true);

HTML

<div class="modal fade" id="view_modal">
    <div class="modal-body">
        <div class="switch_toggle">
            <input type="radio" id="off" name="status" value="inactive" checked>
            <label for="off" class="text-center">OFF</label>
            <input type="radio" id="on" name="status" value="active">
            <label for="on" class="right text-center">ON</label>
            <span aria-hidden="true"></span>
        </div>  
    </div>
</div>

JS

$('.switch_toggle label').on('click', function(){
    var indicator = $(this).parent('.switch_toggle').find('span');
    if ($(this).hasClass('right')){
        $(indicator).addClass('right');
        console.log("active")   //this is appear
    } else {
        $(indicator).removeClass('right');
        console.log("inactive")    //this is appear
    }
});

$("#view_modal").on('hidden.bs.modal', function(e) {
    $('#on').prop('checked', false);    //this is not working
    console.log("inactive modal 2")    //this is appear
});

标签: jqueryhtmlradio-button

解决方案


推荐阅读