jquery ajax功能不起作用

前端之家收集整理的这篇文章主要介绍了jquery ajax功能不起作用前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我的 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);                
        }
    });
});

当我单击提交按钮时,我的ajax请求不起作用,看起来好像控件正在传递给JQuery提交函数,但是ajax请求没有执行/正常工作,有什么问题?

解决方法

将事件处理函数放在$(document).ready(function(){…})中.它现在应该工作

also add preventDefault() to restrict page refreshing

$(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();
            });

        });
原文链接:https://www.f2er.com/jquery/177877.html

猜你在找的jQuery相关文章