Javascript Скрыть / показать раздел не работает при сбросе

0

Я показываю и скрываю div, основанный на некоторых вариантах выбора.

У вас есть раскрывающийся список с включенными и отключенными параметрами. Пользователь выбирает разрешенные, должен отображать div else Скрыть div.

На основе выбора варианта выпадающего меню Hide/Show div работает нормально, но If Disabled - настроенное значение. когда я загружаю страницу, div будет скрыт (отлично работает). Затем я выберу Enabled, затем div покажет, но....... Когда я нажимаю на параметр сброса, опция Dropdown возвращается к Disabled, но раздел Div, который следует скрывать, не скрывать

Здесь у меня есть свой код, как этот, переключатель защиты - это поле wtform, полученное из колбы

{{form.protection_switch}}
            <div align="center" >
            <button class="btn btn-info btn-sm" type="submit"><i class="icon-ok bigger-110"></i>Submit</button>
            &nbsp; &nbsp; &nbsp;
            <button class="btn btn-sm" type="reset"><i class="icon-undo bigger-110"></i>Reset</button>
            </div>

Секция должна быть скрыта или отображена

<div id="protection_data"></br> 
    <table id="grid-table"></table>
    <div id="grid-pager"></div>
</div>

Код JQuery

function protection_selected() {
        if ($('#protection_switch option:selected').val() == '0') {
            $('#protection_data').hide();
        } else  if ($('#protection_switch option:selected').val() == '1') {
            $('#protection_data').show();
        }
    }

    $(document).ready(function() {
    $('#protection_switch').change(function() {
            protection_selected();
        });
    });
    window.onload = protection_selected;
  • 0
    Не связывайте такие события, как window.onload = protection_selected; при использовании jQuery.
  • 0
    Можете ли вы рассказать, что является альтернативным способом привязки к событию загрузки? пожалуйста
Показать ещё 1 комментарий

1 ответ

1
Лучший ответ

Прослушайте щелчок по сбросу.

function protection_selected() {
    var isVisible = $('#protection_switch').val() == '1';
    $('#protection_data').toggle(isVisible);
}

$(function(){  //document ready
    $("#protection_switch")  //get your select element
        .on("change", protection_selected)  //listen for change event
        .change();  //trigger the change event so defaults can be set
    $('input:reset').on("click", function(e){  //bind click event to reset button 
        this.form.reset();  //force reset so we guarantee it has finished running
        protection_selected();  //run the update code
        e.preventDefault();  //cancel the click since we already ran the reset code
    });
});

Боль в задней части об ошибке - вы можете обнаружить, когда она вызвала, но нет события после успешного ее запуска. Вот почему я взял клик, запустил сброс формы, назвал вашу функцию и отменил клик. Другой способ - просто использовать задержку внутри и вызвать функцию, но это может привести к состоянию гонки.

  • 0
    Большое спасибо .... работает нормально ...

Ещё вопросы

Сообщество Overcoder
Наверх
Меню