Сохраняйте значение после отправки формы

#javascript #jquery

Вопрос:

У меня есть флажок этой категории, где, если я выберу определенные значения, он будет отображаться div size , но также в то же время, когда я установлю флажок, он отправит форму. Проблема в том , что если я добавлю this.form.submit() , приведенный ниже код не будет работать, и форма не отправит значение, но если я его не добавлю, код будет работать. Как мне отобразить размер div и отправить форму одновременно?

 function getIds(checkboxName) {
 let checkBoxes = document.getElementsByName(checkboxName);
 let ids = Array.prototype.slice.call(checkBoxes)
           .filter(ch => ch.checked==true)
           .map(ch => ch.value);
 return ids;
}

$(".category").on('change', function() {
 this.form.submit(); 

 let catIds = getIds("category[]");

 $.each(catIds, function(index, value){
    if (value == '1' || value == '2') {
        $("#size").show();
    } else if (value == '3') {
        $("#size").hide();
    }

 });
});

Ответ №1:

Это звучит как гоночная проблема. Форма помещается браузером в другой поток и обрабатывается первой, прежде чем остальная часть javascript сможет завершиться.

Быстрое (но грязное) исправление для меня обычно заключается в использовании метода setTimeout ().

https://developer.mozilla.org/en-US/docs/Web/API/WindowOrWorkerGlobalScope/setTimeout

Таким образом, javascript может работать как по волшебству, а затем форма будет отправлена.