有人可以告诉我为什么单击按钮时不提交此表单吗？
[英]Can someone please tell me why this form does not submit when the button is clicked?
问题描述
We would like our users to click the "Transfer" button and then have the values populated in the javascript below. 
我们希望我们的用户单击“传输”按钮，然后在下面的javascript中填充值。
However, when I click the button, it doesn't fire. 但是，当我单击按钮时，它不会触发。
Any ideas what I am doing wrong and how to fix it? 任何想法我在做什么错以及如何解决？
Thank you 谢谢
<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
</head>
<body>
<form id="form1">
<input type="text" id="user" name="user" />
<input type="password" id="pass" name="pass" />
<input type="button" value="Transer" />
</form>
<script>
$.post("exhume.aspx",
{ data: JSON.stringify({ LoginName: $("#user").val(),Password: $("#pass").val() }) },
function (data) {
var token = JSON.parse(data);
}
);
</script>
</body>
</html>
5 个解决方案
解决方案1
1 2013-12-04 19:01:29
You don't have a click handler for that button, 您没有该按钮的click handler ，
Try this, 尝试这个，
$('#form1 input[type="button"]').click(function(){
$.post("exhume.aspx",
{ data: JSON.stringify({ LoginName: $("#user").val(),Password: $("#pass").val() }) },
function (data) {
var token = JSON.parse(data);
}
);
})
解决方案2
1 2013-12-04 19:02:51
Couple of things here: 这里有几件事：
1.You need to attach the function to the submit event. 1.您需要将该功能附加到Submit事件。
2. You need to prevent the default behaviour of the form so that the page does not refesh 2.您需要防止表单的默认行为，以便页面不会刷新
$("#form1").on("submit", function(e) {
e.preventDefault();
$.post("exhume.aspx",
{ data: JSON.stringify({ LoginName: $("#user").val(),Password: $("#pass").val() }) },
function (data) {
var token = JSON.parse(data);
}
);
});
解决方案3
1 2013-12-04 19:05:30
I think you want 我想你要
$('#form1').on('submit', function() {
$.post("exhume.aspx",
{ data: JSON.stringify({ LoginName: $("#user").val(),Password: $("#pass").val() }) },
function (data) {
var token = JSON.parse(data);
}
);
});
Also, change the type of the Transfer button to submit 另外，更改“转移”按钮的类型以submit
解决方案4
1 2013-12-04 19:06:06
You're overcomplicating this quite a bit. 您使这个复杂化了很多。 You don't need to manually create the data string. 您无需手动创建数据字符串。
You can simply do: 您可以简单地执行以下操作：
HTML: HTML：
<form id="form1" action="exhume.aspx">
<input type="text" id="user" name="user" />
<input type="password" id="pass" name="pass" />
<input type="button" value="Transer" />
</form>
JS: JS：
$('#form1').on('submit', function(e){
e.preventDefault();
var $form = $(this);
$.post( $form.attr('action'), $form.serialize(), function(){
alert('The form was submitted!');
});
});
This approach will allow the form to submit even if JS is not available. 即使JS不可用，这种方法也允许表单提交。
解决方案5
0 已采纳 2013-12-04 19:02:24
The code in the script tag is executed right as the page is loaded, which means it POST s right when you load the page. script标记中的代码是在页面加载后立即执行的，这意味着它在加载页面时即为POST 。 To have it fire on the click event, you need to attach an event-handler to the button. 要使其在click事件上触发，您需要在按钮上附加一个事件处理程序。 Otherwise there is no way that the browser will know to execute your code when the button is clicked. 否则，单击按钮时浏览器将无法执行代码。
<form id="form1">
<input type="text" id="user" name="user" />
<input type="password" id="pass" name="pass" />
<input id="transfer" type="button" value="Transer" />
</form>
<script>
$("#transfer").click(function() {
$.post("exhume.aspx",
{ data: JSON.stringify({ LoginName: $("#user").val(),Password: $("#pass").val() }) },
function (data) {
var token = JSON.parse(data);
}
);
});
</script>
An easier option is to simply bind to the submit event on the form: 一个简单的方法是简单地绑定到表单上的submit事件：
<form id="form1">
<input type="text" id="user" name="user" />
<input type="password" id="pass" name="pass" />
<input type="button" value="Transer" />
</form>
<script>
$("#form1").submit(function() {
$.post("exhume.aspx",
{ data: JSON.stringify({ LoginName: $("#user").val(),Password: $("#pass").val() }) },
function (data) {
var token = JSON.parse(data);
}
);
});
</script>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.