使用jquery对话框在提交之前进行确认

Question

我正在使用表单，并且我想在表单提交前进行确认。在我使用javascript确认之前，现在我想用jQuery的对话框UI替换它。我希望当用户点击按钮“Valider”时，他可以通过点击提交或取消选择提交表单。我在jQuery中是begginer，这是我的代码，但我不工作。

<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/redmond/jquery-ui.css" rel="stylesheet" type="text/css"/> 
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script> 
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"></script> 
<script type="text/javascript"> 
    $(document).ready(function() { 
    $('#valider').click(function(){ 
     $('#dialog').dialog({ 
      modal: true, 
      buttons:{ 
      "submit":function(){ 
       document.form1.submit(); 
      }, 
      "cancel":function(){ 
        $(this).dialog("close"); 
       } 
      } 
     }); 

    }); 
     $('form#testconfirmJQ').submit(function(e){ 
      e.preventDefault(); 
      $('#dialog').dialog('open'); 
     }); 

}); 

</script> 
<form action="test.php" method="post" name="form1"> 
    <input type="submit" name="valider" class="valider" id="valider" value="valider"/> 
</form> 
    <div id="dialog" title="Confirmation"> 
    </div> 
</div> 

当我点击“Valider”时，我简要介绍了对话框，并提交了表单。我对我的代码有点困惑。有人能告诉我我做错了什么吗？提前致谢。

Answer 1

您的jQuery正在寻找$('form#testconfirmJQ')，所以它正在寻找一个form与编号testconfirmJQ。你没有这样的表单，所以jQuery找不到这个元素。您既可以从代码中删除ID，所以它看起来像$('form').submit(function(e){或ID添加到形式，所以它看起来像<form action="test.php" id="testconfirmJQ" method="post" name="form1">