如何使用submit,进行ajax数据提交

$("form").submit(function (e) {var btn = $("#btn_register").button('loading');
        $.ajax({
            url: "/Account/Register",
            type: "Post",
            data: $(this).serialize(),
            success: function (obj) {
                if (obj.code === 0) {
                    swal({
                        title: "恭喜您,注册成功",
                        text: "",
                        type: "success",
                        showCancelButton: false,
                        confirmButtonColor: "#DD6B55",
                        confirmButtonText: "好的",
                        closeOnConfirm: false,
                        closeOnCancel: false
                    }, function (isConfirm) {
                        if (isConfirm) {
                            window.location.href = "./";
                        }
                    });
                    return;
                }
                swal({
                    title: "悲剧了",
                    text: obj.msg,
                    type: "error"
                });
            },
            error: function (error) {
                swal({
                    title: "悲剧了",
                    text: "服务器罢工了吧",
                    type: "error"
                });
            },
            complete: function () {
                btn.button('reset');
            }
        })
        return false;
    });
<script type="text/javascript">
    $(function() {
        $('#form1').submit(function() { //当提交表单时,会发生 submit 事件。
            //此处可做表单验证
            if ($("#username").val() == "") {
                alert("用户名不能为空");
                return false;
            }

            var postData = $("#form1").serialize(); //序列化表单,后台可正常通过post方法获取数据
            $.ajax({
                type: "POST",
                url: "/member/member/post_member",
                data: postData,
                beforeSend: function() {
                    $("#btn-submit").attr("disabled", true);//提交表单前的处理,防止用户多次点击【登陆】,重复提交表单
                    $("#btn-submit").val("正在登陆...");
                },
                success: function(msg) {
                    if (msg == 0) {
                        alert('操作成功');
                        window.location.href = '/member/member';
                    } else {
                        $("#btn-submit").attr("disabled", false);
                        $("#btn-submit").val("登陆");
                        alert("用户或密码错误!");
                    }
                }
            });
        });
    });
</script>
<div>
    <form id="form1" onsubmit="return false;">  //注意:此处必须阻止表单提交
        <!--表单内容部分-->
        <input type="reset" value="重置" />
        <input type="submit" id="btn-submit" value="登陆" />
    </form>
</div>

以上两个差异就是一个是用form标签,一个是用id,在使用id时,注意加上 onsubmit="return false;" 防止重复提交。

福建C# .net  技术群

posted @ 2018-01-29 00:36  Annkiny  阅读(8280)  评论(0)    收藏  举报

福建C# .net  技术群