重寫默認的警報，並確認框

我上採用了傳統的提交按鈕，而不是阿賈克斯提交表單的工作。（有些框架依賴性不允許它）重寫默認的警報，並確認框

我想使用的確認框，用戶提交的前形成。

 <!DOCTYPE html> 
<html> 
<head> 
<!-- <link type="text/css" src="http://localhost/maverick/craftpip/dist/jquery-confirm.min.css"> 

<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> 
<script type="text/javascript" src="http://localhost/maverick/craftpip/dist/jquery-confirm.min.js"></script> --> 

<!-- CSS dependencies --> 
<link rel="stylesheet" type="text/css" href="bootstrap.min.css"> 


<script src="jquery.min.js"></script> 
<script src="bootstrap.min.js"></script> 

<!-- bootbox code --> 
<script src="http://localhost/maverick/bootbox-master/bootbox.js"></script> 
    <script type="text/javascript"> 

    $(document).on('submit', $('#form1'), function(){ 


      alert("works!!!"); 

      bootbox.alert("Hello world!", function() { 
      console.log("Alert Callback"); 
      return false; 
}); 

      }); 

    </script> 
</head> 
<body> 

    <form name="test" action="" type="" id="form1"> 
     <input type="text" name="message" /> 
     <input type="submit" name="Enter" value="Enter" id="mySubmit" /> 
    </form> 

</body>

默認的確認和提示框的作品，但它是一個包裝周圍失敗，形式不確認提交的bootbox。如何覆蓋包裝器的默認行爲？

來源

2016-08-24 coderunner

你必須使用*的preventDefault（）*事件對象的方法，這應該是一個參數*提交*事件處理函數。 –

我看到你在代碼中使用了'$（'＃form1'）'。而是使用'＃form1'' –

確認/提醒後提交添加一些變量作爲確認的狀態。

var confirmed=false;//our state of alert/confirm 
$(document).on('submit', '#form1', function(e){ 


     if (!confirmed) 
     e.preventDefault();//if not confirmed submit is blocked 

     bootbox.alert("Hello world!", function() { 

      //ok we confirmed/alert was shown 
      confirmed=true;//set state on true 

      //run again 
      $('#form1').submit(); //trigger form again 

     }); 

});

所以在第一次提交火，我們得到的e.preventDefault和警報提交停止將顯示，警報之後 - 證實設置爲true，並提交下一次觸發 - 然後形式將所需提交，因爲確認爲真並且e.preventDefault未被調用。

來源

2016-08-24 09:05:46

我只是在解決方案上工作，因爲實際的表格是表中的每一行。我一旦完成就會接受它！（Y）感謝您的幫助。 – coderunner

試試這個：

$(document).ready(function(){ 

    $("[type=submit]").on("click",function(){ 

     alert("works!!!"); 

     return false; 

    }) 
})

最終代碼：

<!DOCTYPE html> 
 
<html> 
 
    <head> 
 
    
 
    <form id="form1" action="http://www.google.com"> 
 
     <button type="submit">Submit</button> 
 
    </form> 
 
     
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
    <script type="text/javascript"> 
 
     
 
    $(document).ready(function(){ 
 
     
 
     $("[type=submit]").on("click",function(){ 
 
     alert("works!!!"); 
 
     return false; 
 
      
 
     }) 
 
    }) 
 
    </script> 
 
</head> 
 
<body>

來源

2016-08-24 09:07:05 Ehsan

重寫默認的警報，並確認框

回答

相關問題