Подсластитель исчезает мгновенно

Question

swal({
    title: "xxx",
    type: "warning",
    showCancelButton: true,
    .....
    },
    function(isConfirm) {
        if (isConfirm) {
            swal("yes, do it!");
        } else {
            swal("cannel!");
        }
    }
);

на моей странице кнопка, связывающая функцию js, функция выполняет этот код. На странице появляется окно подтверждения "Вы уверены", когда я нажимаю кнопку. но когда я нажимаю "да", следующий подсластитель просто вспыхивает и мгновенно исчезает. в чем дело?

Answer 1

Похоже, что операция закрытия плагина использует таймер для некоторой очистки, которая выполняется через 300 мс, поэтому новое предупреждение также очищается.

Один из способов это исправить - использовать таймер

swal({
    title: "xxx",
    type: "warning",
    showCancelButton: true
  },
  function(isConfirm) {
    debugger;
    setTimeout(function() {
      if (isConfirm) {
        swal("yes, do it!");
      } else {
        swal("cannel!");
      }
    }, 400)
  }
);

<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert-dev.js"></script>
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.css" rel="stylesheet" />

Answer 2

Поскольку проблема была решена, рассмотрите это просто как другой подход.

Вы также можете использовать event.preventDefault() для 2-го подсластителя. Я застрял в той же ситуации, за исключением того, что у меня был только 1 подсластитель для отображения.

С этой страницы Mozilla,

Метод protectDefault() интерфейса Event сообщает агенту пользователя, что если событие не обрабатывается явно, его действие по умолчанию не должно выполняться, как обычно.

При нажатии кнопки "Отправить" она появилась для экземпляра, а затем я был перенаправлен на другую страницу (указана в атрибуте действия). Поскольку это происходит по умолчанию, используя event.preventDefault() заставил это остаться.

Спасибо, что поделились своими сомнениями!

Answer 3

просто добавь event.preventDefault(); перед функцией проглатывания это предотвратит его исчезновение.

Answer 4

Установите для атрибута closeonconfirm значение false, т.е. closeOnConfirm: false,

Answer 5

После того, как вы вызываете функцию, которая показывает сладкое предупреждение, убедитесь, что тип кнопки вызова должен оставаться как кнопка, а не отправка.

      <form  method="post">                                 
 <button  type="button" class="btn-wide btn btn-info" onclick="buy_harvest()">Buy</button>
                                            <button  type="submit" class="btn-wide btn-shadow btn btn-success" name="good_condition">Good condition</button>
                                            <button  type="submit" class="btn-wide btn btn-danger" name="inedible">Inedible</button>                                              </form>  

<script>
    function buy_harvest(){
       

    var { value: formValues } = Swal.fire({
        title: 'How mutch want to Buy?',
        showCancelButton: true,
        confirmButtonText: `Buy`,
        html:
          '<div style="float:left;"><input type="text" id="buy_qty" style="width:150px;"><label> Quanity </label></div>' ,
          
        focusConfirm: false,
        preConfirm: () => {
          var buy_qty = document.getElementById("buy_qty").value;
          if(buy_qty!="" || buy_qty!=0){
           
            //call to another function and pass value
            process_buy(buy_qty);
          }       
        }
      })
    }
</script>