javascript - 一个页面中有多个相同的form，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？-PHP Tutorial-php.cn

javascript - 一个页面中有多个相同的form，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？

WBOY

Release： 2016-06-06 20:21:18

Original

1499 people have browsed it

如题：
一个页面中有多个相同的form，写了多个$.ajax的方法，input的id都是一样的，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？

页面先加载的ajax方法

<code>function Ajax(obj){
    $.ajax({
       type:"post",
        url:"ajax.asp",
        data:"Nickname="+$('#inputUser').val(),
        beforeSend:function(){
            $('#yhm').append(process_request);
        },
        //用户名检测

        success:function(res){
            if(res>"0"){
                $('#inputUser').attr('class','FrameDivWarn');
                showInfo("yhm",msg_un_registered);
                change_submit("true");//禁用提交按钮
            }
           if(res=="0"){
               $('#inputUser').attr('class','FrameDivPass');
               showInfo("yhm",msg_can_rg);
               change_submit("false");//禁用提交按钮
               $("#yhm").attr('class','ts-lg');
           }
        }
    });

};
</code>

Copy after login

页面后加载的ajax方法

<code>    //弹窗-异步
function tc_Ajax(obj){
    $.ajax({
       type:"post",
        url:"ajax.asp",
        data:"Nickname="+$('#inputUser').val(),
        beforeSend:function(){
            $('#tc_yhm').append(process_request);
        },
        //用户名检测

        success:function(res){
            if(res>"0"){
                $('#inputUser').attr('class','FrameDivWarn');
                showInfo("tc_yhm",msg_un_registered);
                change_submit("true");//禁用提交按钮
            }
           if(res=="0"){
               $('#inputUser').attr('class','FrameDivPass');
               showInfo("tc_yhm",msg_can_rg);
               change_submit("false");//禁用提交按钮
               $("#tc_yhm").attr('class','ts-lg');
           }
        }
    });

};
</code>

Copy after login

情况说明：
一个页面有两个注册，一个是在首页上的异步验证是可以用的。一个是点登录弹窗异步验证用的。
通常这种情况，实际开发中是怎么处理，用什么方式去做更合理。(能不能把多个相同的验证整合到一个ajax方法中？)

后加载的ajax方法，查看HTTP，数据并没有发送到服务器端，是什么情况？

javascript - 一个页面中有多个相同的form，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？

先写的ajax方法，数据是可以成功发送到服务器端的，并且返回值也对。

javascript - 一个页面中有多个相同的form，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？

问题:是什么地方引起了冲突了？

回复内容：

页面先加载的ajax方法

<code>function Ajax(obj){
    $.ajax({
       type:"post",
        url:"ajax.asp",
        data:"Nickname="+$('#inputUser').val(),
        beforeSend:function(){
            $('#yhm').append(process_request);
        },
        //用户名检测

        success:function(res){
            if(res>"0"){
                $('#inputUser').attr('class','FrameDivWarn');
                showInfo("yhm",msg_un_registered);
                change_submit("true");//禁用提交按钮
            }
           if(res=="0"){
               $('#inputUser').attr('class','FrameDivPass');
               showInfo("yhm",msg_can_rg);
               change_submit("false");//禁用提交按钮
               $("#yhm").attr('class','ts-lg');
           }
        }
    });

};
</code>

Copy after login

页面后加载的ajax方法

<code>    //弹窗-异步
function tc_Ajax(obj){
    $.ajax({
       type:"post",
        url:"ajax.asp",
        data:"Nickname="+$('#inputUser').val(),
        beforeSend:function(){
            $('#tc_yhm').append(process_request);
        },
        //用户名检测

        success:function(res){
            if(res>"0"){
                $('#inputUser').attr('class','FrameDivWarn');
                showInfo("tc_yhm",msg_un_registered);
                change_submit("true");//禁用提交按钮
            }
           if(res=="0"){
               $('#inputUser').attr('class','FrameDivPass');
               showInfo("tc_yhm",msg_can_rg);
               change_submit("false");//禁用提交按钮
               $("#tc_yhm").attr('class','ts-lg');
           }
        }
    });

};
</code>

Copy after login

后加载的ajax方法，查看HTTP，数据并没有发送到服务器端，是什么情况？

javascript - 一个页面中有多个相同的form，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？

先写的ajax方法，数据是可以成功发送到服务器端的，并且返回值也对。

javascript - 一个页面中有多个相同的form，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？

问题:是什么地方引起了冲突了？

一. 你的这两个方法的代码基本上是一样的, 不一样的地方只是去操作不对DOM节点.

javascript - 一个页面中有多个相同的form，分别去发起异步请求，后写的$.ajax方法，数据发送不出去，控制台也没有报错？

所以, 你可以把要操作的DOM节点做为参数传递过去, 这样就可以共用同一个方法.

二. 你所描述的,你第一个的Ajax发送的数据中内容为空, 说明你的代码执行的时候,你的那个框还没赋值,所以取到的是空.

且, 你只描述了你的函数的定义,并没有描述你是怎么调用的, 在什么时间点调用的.

每个form中的input id都是一样的？同样的id肯定冲突啊？

ID不能有两个相同的，根据你的描述你看下是不是出现了两个相同ID的input
还有就是像上面说的，你不觉得写两个功能完全一样的函数是浪费代码行么。

<code>两个ID相同的元素并没有什么影响。
题主描述的问题有错误的地方 "数据没有发送出去？"  这是指ajax请求没有发送数据，根据提问者的贴图明显是发送之前就没有取到数据并不是没有发送数据。
"控制台没有报错？" 是前端控制台没有报错还是后台没有报错。前端还少一个error的回调方法，如果进了error那你这根本就没办法回调。</code>

Copy after login