使用jQuery提交表單確認對話框替換

我正在使用此jQuery Confirm Dialog Replacement腳本進行常規文本鏈接。但我也想在提交表單時使用它，並且遇到問題。使用jQuery提交表單確認對話框替換

HTML：

<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<title>A jQuery Confirm Dialog Replacement with CSS3 | Tutorialzine Demo</title> 

<link href='http://fonts.googleapis.com/css?family=Cuprum&amp;subset=latin'  rel='stylesheet' type='text/css'> 
<link rel="stylesheet" type="text/css" href="jquery.confirm/jquery.confirm.css" /> 

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script> 
<script src="jquery.confirm/jquery.confirm.js"></script> 
<script src="js/script.js"></script> 

</head> 
<body> 


    <form action="test.php" method="post" id="reg"> 
     <input type="submit" name="submit" class="confirm" value="Submit" /> 
    </form> 

</body> 
</html>

的script.js：

$(document).ready(function(){ 

$('.confirm').click(function(e){ 
    e.preventDefault(); 


    $.confirm({ 
     'title'  : 'Delete Confirmation', 
     'message' : 'You are about to delete this item. <br />It  cannot be restored at a later time! Continue?', 
     'buttons' : { 
      'Yes' : { 
       'class' : 'blue', 
       'action': function(){ 
        $("#reg").submit(); 
       } 
      }, 
      'No' : { 
       'class' : 'gray', 
       'action': function(){} 
      } 
     } 
    }); 

}); 

});

這是爲什麼不工作？謝謝您的回答！

來源

2012-02-22 rannt

你可以定義「不工作」？ – simchona 2012-02-22 18:58:52

它是否正在執行提交而不工作甚至沒有到達那裏？ – Evan 2012-02-22 19:00:58

對不起，不夠具體：當我點擊提交按鈕時，出現確認對話框。然後，如果我在此對話框上單擊「是」，對話框將消失，但表單不會提交提交。 – rannt 2012-02-22 19:03:54

這裏是更新的JS來嘗試，以防萬一我的評論很混亂。

TRY 1：

$(document).ready(function(){ 

$('.confirm').click(function(e){ 
    e.preventDefault(); 


    $.confirm({ 
     'title'  : 'Delete Confirmation', 
     'message' : 'You are about to delete this item. <br />It  cannot be restored at a later time! Continue?', 
     'buttons' : { 
      'Yes' : { 
       'class' : 'blue', 
       'action': function(){ 
        $("form").submit(); 
       } 
      }, 
      'No' : { 
       'class' : 'gray', 
       'action': function(){} 
      } 
     } 
    }); 
}); 

});

TRY 2：

$(document).ready(function(){ 

$('.confirm').click(function(e){ 
    // e.preventDefault(); 


    $.confirm({ 
     'title'  : 'Delete Confirmation', 
     'message' : 'You are about to delete this item. <br />It  cannot be restored at a later time! Continue?', 
     'buttons' : { 
      'Yes' : { 
       'class' : 'blue', 
       'action': function(){ 
        $("#reg").submit(); 
       } 
      }, 
      'No' : { 
       'class' : 'gray', 
       'action': function(){} 
      } 
     } 
    }); 
    return false; 
}); 

});

來源

2012-02-22 19:46:32

不行，不起作用。如果我把alert（'test'）;'而不是'$（「＃reg」）。submit（）;'，alert框會顯示出來。我也可以通過'alert（$（「＃reg」）。attr（'method'））;'獲得表單屬性，並顯示在警告框中，但是我無法提交它。 – rannt 2012-02-22 20:12:11

嗯，我真的很困惑。您的HTML代碼，插件代碼或您的JS代碼中沒有任何內容被破壞。我測試過自己，並遇到同樣的問題（多個瀏覽器）。另一個不理想的方法是使用$ .post（）或$ .get（），序列化數據並通過AJAX提交。 – 2012-02-23 04:56:00

這是一個選項，我想避免。現在我要使用這個解決方案：[link]（http://www.jensbits.com/2009/08/10/modal-confirmation-dialog-on-form-submit-javascript-jquery-ui-and -thickbox-varieties /）（jQuery UI對話框）。當然，如果有人發現上述問題的解決方案，我會很感激！ – rannt 2012-02-23 12:07:42

使用jQuery提交表單確認對話框替換

回答

相關問題