JQuery swal確認未提交

Question

我正在嘗試使用sweet alert創建確認。當用戶點擊按鈕時，打開swal（警報）窗口，他們可以確認或取消。如果點擊了confirm，那麼點擊應該點擊JQuery。

但它沒有做任何事情。你知道問題在哪裏嗎？

我試過多種選擇 - unbind.click()等。

$('.button-apply').on('click', function (e) { 
     var t = $(this); 
     e.preventDefault(); 
     swal({ 
      title: "Are you sure?", 
      text: "Do you want to apply for this job?", 
      type: "info", 
      showCancelButton: true, 
      confirmButtonColor: "#b3ff99", 
      confirmButtonText: "Confirm", 
      //closeOnConfirm: false, 
      //showLoaderOnConfirm: true, 
      html: false 
     }, function (isConfirm) { 
      if (!isConfirm) { 
       return; 
      } else { 
       t.click(); 
      } 
     }) 

    }) 

編輯： 改變} else { t.click(); }

到

} else { 
       t.unbind('click'); 
       t.trigger('click'); 
      } 

成功地解除綁定，但t.trigger('click')不執行。

解決：

因爲它是一個<a href....>，我不能這樣做t.submit()時，它的unbinded所以我把它換成t.click()與window.location.href = t.attr('href');和它工作正常。

Answer 1

您已指定e.preventDefault();這將防止發生在button-apply上的事件發生。刪除這一行，點擊事件將回來。

作爲用戶按下取消時的附加說明，您再次觸發相同的事件會導致無限循環。如果用戶執行此操作，您應該刪除t.click();並放置您想要調用的邏輯。

舉個例子：

$('.button-apply').on('click', function (e) { 
 
     var t = $(this); 
 
     swal({ 
 
      title: "Are you sure?", 
 
      text: "Do you want to apply for this job?", 
 
      type: "info", 
 
      showCancelButton: true, 
 
      confirmButtonColor: "#b3ff99", 
 
      confirmButtonText: "Confirm", 
 
      //closeOnConfirm: false, 
 
      //showLoaderOnConfirm: true, 
 
      html: false 
 
     }, function (isConfirm) { 
 
      if (!isConfirm) { 
 
       alert('You have not applied for the job!'); 
 
      } else { 
 
       alert('You have applied for the job'); 
 
       // Submit form $("#yourForm").submit(); 
 
       // or an AJAX call. 
 
      } 
 
     }) 
 

 
    })

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script> 
 
<link href="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.css" rel="stylesheet"/> 
 
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/1.1.3/sweetalert.min.js"></script> 
 

 

 
<button class="button-apply">Click me</button>