8

我有一个jsp页面如下：

<script type="text/javascript" src="/mywebapp/js/jquery.js"></script>
<script type="text/javascript">         
 $( function() {  
  $('#testform').submit(function(){
   alert('now starting submit');
   return true;
  });

  $("#test1btn").click(function(){
   $('#testform #submit').click();    
  }); 
  $("#test2btn").click(function(){
   $('#testform').submit();    
  }); 
 });    
</script>
<form id="testform" method="post"  action="backend/search_test.do">
<input id="reqpagenr" name="reqpagenr" size="10">
<input type="button" id="test1btn"  value="TestClick"/>
<input type="button" id="test2btn"  value="TestSubmit"/>
<input id="submit" type="submit" value="Go">
</form>

当我手动单击（即使用鼠标）按钮“开始”时，在显示文本“现在开始提交”后提交表单；单击“TestClick”按钮时，表单提交成功，但没有出现“现在开始提交”文本；单击“TestSubmit”按钮时，会出现“现在开始提交”文本，但根本没有提交表单。

与我的预期相反，“TestClick”和“TestSubmit”按钮的功能与“Go”按钮在单击两者时的功能不同。在我的理解中，三个按钮点击应该做同样的事情，即在出现“现在开始提交”文本后提交表单。所以我的问题是，为什么三个按钮点击的结果不同？

我正在使用 jquery 1.3.2

4

4 回答 4

6

当通过 $('#testform').submit(); 手动设置表单提交时，看起来 jQuery 提交事件处理程序被忽略了。

这应该在点击处理程序中工作：

$('#testform').trigger("submit")
于 2011-01-20T19:37:07.237 回答
5

第二个按钮没有提交表单，因为 jQuery（或 DOM）中的错误导致submit方法失败，如果提交按钮的 id 是“提交”。见：http ://bugs.jquery.com/ticket/1414

于 2011-01-27T22:48:36.507 回答
1

更新：

  1. 实际上，正如richardml所说，您遇到的第一个问题是一个 jQuery 错误，所以第一件事是将id提交的名称重命名为其他名称。

  2. 第二个问题是typetest1btn应该 input是type="submit"为了表现得像一个正常的提交按钮。

诀窍是在鼠标悬停时更改类型，因此代码将如下所示：

$(function() {
    $('#testform').submit(function() {
        alert('now starting submit');
    });
    //TestClick
    $('#test1btn').hover(function() {
        $(this)[0].setAttribute('type', 'submit');
    },function() {
        $(this)[0].setAttribute('type', 'button');
    });
    //TestSubmit
    $('#test2btn').click(function() {
        $('#testform').submit();
    });
});

其余的按预期工作。

希望这有帮助

于 2011-01-29T15:51:47.020 回答
0

您应该使用 onsubmit 事件来触发该功能。

<form id="testform" method="post" onsubmit="foo()" action="backend/search_test.do">

每当您使用提交按钮或 submit() 方法提交表单时，这都会触发 foo()。

于 2016-02-21T07:05:31.990 回答