我的html像这样
<form name="postcontent" id="postcontent"> <input name="postsubmit" type="submit" id="postsubmit" value="POST"/> <textarea id="postdata" name="postdata" placeholder="What's Up ?"></textarea> </form>
jQuery代码如下
$("#postcontent").submit(function(e) { $.ajax({ type:"POST", url:"add_new_post.php", data:$("#postcontent").serialize(), beforeSend:function(){ $(".post_submitting").show().html("<center><img src='images/loading.gif'/></center>"); },success:function(response){ //alert(response); $("#return_update_msg").html(response); $(".post_submitting").fadeOut(1000); } }); });
当我单击Submit按钮时,我的ajax请求无法正常工作,看起来好像控件正在传递给JQuery Submit函数,但是ajax请求没有正确执行/正常工作,这是怎么回事?
将事件处理函数放入$(document).ready(function(){…})中。它现在应该工作
还添加preventDefault()以限制页面刷新
$(document).ready(function() { $("#postcontent").submit(function(e) { e.preventDefault(); $.ajax({ type : "POST", url : "add_new_post.php", data : $("#postcontent").serialize(), beforeSend : function() { $(".post_submitting").show().html("<center><img src='images/loading.gif'/></center>"); }, success : function(response) { alert(response); $("#return_update_msg").html(response); $(".post_submitting").fadeOut(1000); } }); e.preventDefault(); }); });