jQuery 单击按钮时调用ajax
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16646994/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
calling ajax on button click
提问by user2234992
I have a simple html button.
我有一个简单的 html 按钮。
When I click it, the ajax is called.
当我单击它时，将调用 ajax。
This is my code.
这是我的代码。
<INPUT type="button" class="form6form" id="newsubmit" name="newsubmit" value="Submit">
And here is the ajax full code.
这是 ajax 的完整代码。
I want the ajax to validate my code and then use success handler
我希望 ajax 验证我的代码，然后使用成功处理程序
$('body').on('click', '#newsubmit', function (event) {
$("#form6").validate({
debug: false,
rules: {
plnonew: "required",
pldtnew: "required",
noboxnew: "required",
},
messages: {
plnonew: "Please select a pack list id..",
pldtnew: "Please select a date..",
noboxnew: "Please select a box no..",
},
submitHandler: function (form) {
$.ajax({
type: "POST",
url: "try.php",
data: $('#form6').serialize(),
cache: false,
success: function (html) {
var div1 = $(html).filter('#div1');
loading_hide();
$("#container").html(div1);
}
});
}
});
});
Nothing happens when i click the button.
当我点击按钮时什么也没有发生。
Any idea? Thank you.
任何的想法？谢谢你。
回答by Mayur Baldha
At html code client Side index.html file
在 html 代码客户端 index.html 文件
<!doctype html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script>
function myCall() {
var request = $.ajax({
url: "ajax.php",
type: "GET",
dataType: "html"
});
request.done(function(msg) {
$("#mybox").html(msg);
});
request.fail(function(jqXHR, textStatus) {
alert( "Request failed: " + textStatus );
});
}
</script>
<meta charset="utf-8" />
<title>My jQuery Ajax test</title>
<style type="text/css">
#mybox {
width: 300px;
height: 250px;
border: 1px solid #999;
}
</style>
</head>
<body>
The following div will be updated after the call:<br />
<div id="mybox">
</div>
<input type="button" value="Update" />
</body>
</html>
At server side ajax.php file
在服务器端 ajax.php 文件
<?php
echo '<p>Hi I am some random ' . rand() .' output from the server.</p>';
?>
回答by adeneo
The submitHandlerin the validate plugin replaces the native submit, an input with the type buttonwill not submit the form and trigger the sumbitHandler, so change this:
将submitHandler在验证插件替换了原生提交，与该类型的输入button将不提交表单并触发sumbitHandler，所以更改此：
<INPUT type="button" class="form6form" id="newsubmit" name="newsubmit" value="Submit">
to:
到：
<input type="submit" class="form6form" id="newsubmit" name="newsubmit" value="Submit">
And initialize the validation outside the click handler.
并在点击处理程序之外初始化验证。
