ajax在firefox和chrome下提交不成功的解决办法

代码

<div class="modal fade" id="myRegist" tabindex="-1" role="dialog"
    aria-labelledby="myModalLabel" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                    aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">&nbsp;</h4>
            </div>
            <div class="modal-body">
                <div class="register-container animated fadeInDown">
                    <form role="form">
                        <div class="registerbox bg-white">
                            <div class="registerbox-title">注册</div>

                            <div class="registerbox-caption ">请填写下列信息</div>

                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <span class="input-icon icon-right"> <input type="text"
                                            class="form-control" placeholder="姓名 " id="username">
                                            <i class="fa fa-user"></i>
                                        </span>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <span class="input-icon icon-right">
                                        
                                        
                                        
                                        <select class="form-control"  id="sex" >
                                            <option value="">性别</option>
                                            <option value="男">男</option>
                                            <option value="女">女</option>
                                            </select>
                                        
                                        
                                        <!-- <input type="text"
                                            class="form-control" placeholder="性别" id="sex"> --> <i
                                            class="fa fa-user"></i>
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <span class="input-icon icon-right"> <input type="text"
                                            class="form-control" placeholder="手机" id="phone"> <i
                                            class="glyphicon glyphicon-phone"></i>
                                        </span>
                                    </div>
                                </div>
                                <div class="col-sm-6">
                                    <div class="form-group">
                                        <span class="input-icon icon-right"> <input type="text"
                                            class="form-control" placeholder="其他联系方式" id="telephone">
                                            <i class="glyphicon glyphicon-earphone"></i>
                                        </span>
                                    </div>
                                </div>
                            </div>
                            <div class="form-group">
                                <span class="input-icon icon-right"> <input type="text"
                                    class="form-control" placeholder="单位" id="corporation">
                                    <i class="glyphicon glyphicon-user circular"></i>
                                </span>
                            </div>
                            <div class="form-group">
                                <div class="form-group">
                                    <span class="input-icon icon-right"> <input type="text"
                                        class="form-control" placeholder="地址" id="adress"> <i
                                        class="fa fa-globe"></i>
                                    </span>
                                </div>
                            </div>
                            <div class="form-group">
                                <span class="input-icon icon-right"> <input type="text"
                                    class="form-control" placeholder="登录名" id="loginname">
                                    <i class="glyphicon glyphicon-user circular"></i>
                                </span>
                            </div>
                            <div class="form-group">
                                <span class="input-icon icon-right"> <input
                                    type="password" class="form-control" placeholder="密码"
                                    id="loginpwd"> <i class="fa fa-lock circular"></i>
                                </span>
                            </div>
                            <div class="loginbox-submit">
                                <button type="button" class="btn btn-primary btn-block "
                                    onclick="index_regiest()">注册</button>
                            </div>
                        </div>
                    </form>
                </div>
            </div>

        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal -->
</div>


function index_regiest() {

        var username = $("#username").val();
        var sex = $("#sex").val();
        var phone = $("#phone").val();
        var telephone = $("#telephone").val();
        var corporation = $("#corporation").val();
        var adress = $("#adress").val();
        var loginname = $("#loginname").val();
        var loginpwd = $("#loginpwd").val();

        $.ajax({
            type : "POST",
            url : "../user/addUser.do",
            data : {
                username : username,
                sex : sex,
                phone : phone,
                telephone : telephone,
                corporation : corporation,
                adress : adress,
                loginname : loginname,
                loginpwd : loginpwd

            },
            success : function(msg) {
                
                alert(msg)
                
                 if ("注册成功" == msg) {
                    //alert(msg)
                    window.location.reload();
                }

            }
        });




在火狐和谷歌上为正确执行index_regiest()的Ajax请求,查了很多资料,终于找到原因了,

如果button被firefox,chrome视为submit,就可以合理解释出现的问题了. 
button的onclick事件和submit同时触发,ajax发出请求后(默认异步提交),submit事件终止了ajax的请求,因此,在chrome的开发人员工具里面可以看到这一奇怪的现象,status是cancled,type是pending(正常应该是text/html或其他)
把input的type改成button,则可以正确执行

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值