使用jquery在点击事件上提交表单 [英] submit form on click event using jquery
问题描述
<！DOCTYPE html PUBLIC - // W3C // DTD XHTML 1.0 Transitional // ENhttp://www.w3.org/TR/xhtml1 /DTD/xhtml1-transitional.dtd\">
< html xmlns =http://www.w3.org/1999/xhtml>
< head>
< meta http-equiv =Content-Typecontent =text / html; charset = utf-8/>
< title>无标题文档< / title>
< script type =text / javascriptsrc =https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js>< / script>
< script type =text / javascript>
$（function（）{
$（'＃submitButton'）。click（function（e）{
e.preventDefault（）;
$（＃testForm） .submit（）;
}）;
$（'＃submitLink'）。click（function（e）{
e.preventDefault（）;
$ （#testForm）。submit（）;
}）;
}）;
< / script>
< / head>
< body>
< label>名称< / label>
< input type =textname =namevalue =/>
< input type =submitname =submitvalue =Submitid =submitButton/>
< p>< a href =＃id =submitLink>提交表单< / a>< / p>
< / form>
< / body>
< / html>
谢谢！
如果你有一个表单动作和一个输入类型=在表单标签中提交，它会提交旧式的方式并基本刷新页面。当进行AJAX类型的交易时，这不是理想的效果。
删除操作。或者完全删除表单，尽管它可以方便地序列化以减少工作量。如果表单标签保持不变，则将按钮移动到表单标签之外，或者使其成为与onclick或click处理程序的链接，而不是输入按钮。 Jquery UI Buttons在这种情况下效果很好，因为您可以使用标签元素来模仿输入按钮。
So can someone please tell why neither of these options will actually submit the form? I am trying to do something more complicated but I have boiled it down to this to try and figure out why I can't seem to get this form to submit using a click event and submit()
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<script type="text/javascript">
$(function() {
$('#submitButton').click(function(e) {
e.preventDefault();
$("#testForm").submit();
});
$('#submitLink').click(function(e) {
e.preventDefault();
$("#testForm").submit();
});
});
</script>
</head>
<body>
<form action="javascript:alert('submitted');" method="post" id="testForm">
<label>Name</label>
<input type="text" name="name" value="" />
<input type="submit" name="submit" value="Submit" id="submitButton" />
<p><a href="#" id="submitLink">Submit Form</a></p>
</form>
</body>
</html>
Thank you!
If you have a form action and an input type=submit inside form tags, it's going to submit the old fashioned way and basically refresh the page. When doing AJAX type transactions this isn't the desired effect.
Remove the action. Or remove the form altogether, though in cases it does come in handy to serialize to cut your workload. If the form tags remain, move the button outside the form tags, or alternatively make it a link with an onclick or click handler as opposed to an input button. Jquery UI Buttons works great in this case because you can mimic an input button with an a tag element.
这篇关于使用jquery在点击事件上提交表单的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
