[英]jquery $.ajax is not working. form post
I want use jquery to sent form data to server, and I follow this page↓ 我想使用jquery将表单数据发送到服务器,然后关注此页面↓
how do i submit a form using get method in jquery . 如何在jquery中使用get方法提交表单 。
But is not working, has no any window alert. 但是不起作用,没有任何窗口警报。 I don't know why.... 我不知道为什么。
I already import the jquery script in head(version 1.11.3). 我已经在头(版本1.11.3)中导入了jquery脚本。
<script src="./static/jquery-1.11.3.js" type="text/javascript"></script>
this is my script. 这是我的剧本。
<script>
function test(){
document.getElementById("form_test").submit( function() {
$.ajax({
url : $(this).attr('action'),
type : $(this).attr('method'),
data : $(this).serialize(),
success : function( response ) {
alert( response );
},
error:function(){
alert("error");
}
});
return false;
});
}
</script>
this is my form code. 这是我的表单代码。
<form id="form_test" class="appnitro" method="post" action="">
<div class="form_description">
<p>test.</p>
</div>
<ul >
<li id="li_1" >
<label class="description" for="info">info</label>
<div>
<input id="info" name="info" class="setInfo" type="text" maxlength="16" value=""/>
<label id="infoMsg" class="Message"></label><br/>
</div>
</li>
<li class="buttons">
<button type="button" class="mbutton" onclick="test()">submit</button>
</li>
</ul>
</form>
You need to have a form submit event handler registered in the dom ready handler 您需要在dom ready处理程序中注册一个表单提交事件处理程序
$(function () {
$("#form_test").submit(function () {
$.ajax({
url: $(this).attr('action'),
type: $(this).attr('method'),
data: $(this).serialize(),
success: function (response) {
alert(response);
},
error: function () {
alert("error");
}
});
return false;
});
})
In your code, you are calling the test
method on click of the button, which calls the form
elements submit function with a callback 在您的代码中,单击按钮即调用test
方法,该方法调用带有回调的form
元素Submit函数
Remove the submit handler from test()
从test()
删除提交处理程序
document.getElementById("form_test").submit(function () {
This is not required as the function test
is being called when user clicks on the button. 这不是必需的,因为当用户单击按钮时将调用功能test
。
function test() {
var $form = $('#form_test');
$.ajax({
url: $form.attr('action'),
type: $form.attr('method'),
data: $form.serialize(),
success: function (response) {
alert(response);
},
error: function () {
alert("error");
}
});
return false;
}
I would also suggest you to use jQuery on()
to bind event 我也建议您使用jQuery on()
绑定事件
$('#form_test').on('submit', function () {
$.ajax({
url: $(this).attr('action'),
type: $(this).attr('method'),
data: $(this).serialize(),
success: function (response) {
alert(response);
},
error: function () {
alert("error");
}
});
return false;
});
As you used inline js in submit button, no need for submit event handle for this. 当您在“提交”按钮中使用内联js时,无需为此提供提交事件句柄。 See code below : 参见下面的代码:
<script>
function test(){
var myForm = document.getElementById("form_test");
$.ajax({
url : $(myForm).attr('action'),
type : $(myForm).attr('method'),
data : $(myForm).serialize(),
success : function( response ) {
alert( response );
},
error:function(){
alert("error");
}
});
return false;
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.