当前位置: 首页 > 面试题库 >

AJAX呼叫可在Chrome和Safari中使用,但不能在Firefox和IE中使用?

卢枫涟
2023-03-14
问题内容

这是我的代码,用于在用户忘记密码的情况下重置用户密码。数据通过AJAX请求发送到PHP代码,PHP代码根据输入的有效性简单地回显“ Y”或“ N”。

问题是,AJAX调用在Firefox 19和IE
9中不起作用。我没有在其他版本的IE中尝试过。AJAX调用可在chrome和safari中完美运行。有人遇到过同样的问题吗?有人可以帮忙吗?

    <title> Forgot Password? </title>

    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script type="text/javascript" src="http://jzaefferer.github.com/jquery-  validation/jquery.validate.js"></script>

    <style type="text/css">

        label.error { color: red;  }

        #status { color: green; }

    </style>

    <script>

        $(document).ready(function(){

            $('#code_form').hide();

            $('#password_form').hide();

            $("#email_form").validate({

                onkeyup: false,

                rules: {

                  email: {
                    required: true,
                    email: true
                  }
                },

                messages: {
                  email: {
                  required: "Please enter your email ID.",
                  email: "Please enter a valid email ID."
                 }
               }

            });


            $('#email_send').click(function() {

                event.preventDefault();

                var email = $('#email').val();

                $.ajax({
                    type: "POST",
                    url: "reset_code.php",

                    data: {email: email},
                    cache: false,
                    success: function(response){

                    if(response == "Y")
                    {
                        $('#code_form').show();
                        $('#email_send').hide();
                        $('#status').html("Check your mail for the reset code.");

                    }
                    else
                    {

                        $('#status').html("Looks like you have entered a wrong email ID.");

                    }

                 }

            });

            });


            $("#code_form").validate({

                onkeyup: false,

                rules: {

                  code: {
                    required: true,
                    digits: true
                  }
                },

                messages: {
                  code: {
                  required: "Please enter the code received in your mail.",
                  digits: "Please enter the code received in your mail."
                 }
               }

             });

             $('#code_send').click(function() {

               event.preventDefault();

               var email = $('#email').val();
               var code = $('#code').val();


                $.ajax({
                type: "POST",
                url: "code_verify.php",

                data: {email: email, code: code},
                cache: false,
                success: function(response){

                    if(response == "Y")
                    {
                        $('#password_form').show();
                        $('#code_send').hide();
                        $('#status').html("Ok, now enter your password twice before you forget again.");

                    }
                    else
                    {
                        $('#status').html("Please enter the code received in your mail.");
                    }

                }

            });

            });


            $("#password_form").validate({

                onkeyup: false,

                rules: {

                  password: {
                    required: true,
                    minlength: 8
                  },
                  repassword: {
                    required: true,
                    equalTo: "#password"  
                  }
                }

            });

            $('#password_send').click(function() {

               event.preventDefault();

               var email = $('#email').val();
               var password = $('#password').val();
               var repassword = $('#repassword').val();

                $.ajax({
                    type: "POST",
                    url: "update_password.php",

                    data: {email: email, password: password, repassword: repassword},
                    cache: false,
                    success: function(response){

                    if(response == "Y")
                    {

                        $('#email_form').hide();
                        $('#code_form').hide();
                        $('#password_form').hide();
                        $('#status').html("Password reset successful. Proceed to <a href=index.php>login</a> page. ");


                    }
                    else
                    {
                        $('#status').html("Oops. Something went wrong. Try again.");

                    }

                }


            });

        });

    });


    </script>

</head>

<body class="oneColElsCtr">

    <div class ="about_body">

        <a href="index.php"><img src="images/title_block_logon.png" style="margin-    top:25px; margin-bottom:-10px;"/></a><br/>

        <div id="status" class="alert alert-success"  style="margin-top:20px; width:400px; margin-left:235px; margin-bottom:30px;">

            <h4 class="alert-heading"> Reset your password </h4>

        </div>

        <form class="form-horizontal" name="email_form" id="email_form" method="POST" action="" >

            <fieldset>

                <div class="control-group" style="margin-left:230px">

                    <label class="control-label">Email</label>

                    <div class="controls" align="left">

                        <input name="email" id="email" class="input-large" type="text" placeholder="Enter your Email id"/>

                    </div>

                </div>

                <div class="control-group">

                    <button type="submit" id="email_send" class="btn btn-inverse submit">GO</button>

                </div>

            </fieldset>

        </form>

        <form class="form-horizontal" name="code_form" id="code_form" method="POST" action="" >

            <p>Enter the code received in your Email</p>

            <fieldset>

                <div class="control-group" style="margin-left:230px">

                    <label class="control-label">Code</label>

                    <div class="controls" align="left">

                        <input name="code" id="code" class="input-large" type="text" placeholder="#####"/>

                    </div>

                </div>

                <div class="control-group">

                    <button type="submit" id="code_send" class="btn btn-inverse  submit">GO</button>

                </div>

            </fieldset>

        </form>

        <table style="text-align:left">

            <tr>

                <td width="60%">

                    <form class="form-horizontal" name ="password_form" id="password_form" method ="POST" action ="" >

                        <fieldset>

                            <div class="control-group" style="margin-left:90px;">

                                <label class="control-label">Password</label>

                                <div class="controls">

                                    <input name="password" id="password" class="input-large" type="password" placeholder="Enter your Password" onfocus="Info_Over('#password_on_focus_info')" onblur="Info_Out('#password_on_focus_info')"/>

                                </div>

                            </div>

                            <div class="control-group" style="margin-left:90px;">

                                <label class="control-label">Confirm Password</label>

                                <div class="controls">

                                    <input name="repassword" id="repassword" class="input-large" type="password" placeholder="Re-enter your Password"/>

                                </div>

                            </div>

                            <div class="control-group" style="margin-left:250px;">

                                <button type="submit" id="password_send" class="btn btn-inverse submit">CONFIRM</button>

                            </div>

                        </fieldset>

                    </form>

                </td>

                <td width="400px" valign="top" style="padding-right:130px">

                    <span id="password_on_focus_info" style="display:none;">

                        Password should be 8 characters or more. Choose a strong password which is a combination of Capital and Small case alphabets, Symbols and Numbers.

                     </span>

                </td>

            </tr>

        </table>

    </div>

</body>
</html>

问题答案:

您必须使用事件对象作为事件处理程序的参数,Chrome和Safari在触发事件但Firefox不触发时,具有一个名为event的全局事件对象。这样event.preventDefault();会导致错误。

例如

$('#email_send').click(function(event) {


 类似资料:
  • 问题内容: 好吧,我会简短。我有这个脚本将值放在数据库中。它可以在Chrome,Safari中完美运行,但不能使其在Firefox或IE中运行。似乎数据甚至都没有发布到.php文件中,而ajax根本没有启动。有人吗 这是我的jQuery脚本: 这是我的php文件中的内容: 问题答案: 您没有将事件处理程序定义为参数,因此在 浏览器尝试在全局范围内查找。Chrome碰巧在全局范围内提供了事件对象(因

  • 问题内容: 我正在维护一个使用Javascript的网站。该脚本使用jQuery并从通常托管该站点的服务器中加载一些内容。 为了方便维护网站,我在iMac上运行了网站的本地副本。当我使用Safari时,这工作得很好。但是Firefox,Opera和Chrome拒绝运行。我想这是因为跨域策略。(我无法使用IE对此进行测试,因为IE必须在我的iMac上的虚拟机中运行,因此由于这个原因,无法访问任何本地

  • 问题内容: 我们在www.saddleback.com/live上有一个网页,Chrome和Firefox CORS AJAX调用在某些Mac机器上被中止。在装有OSX 10.9(最新更新),Chrome和Firefox(最新更新)的Mac上,对http://api.saddleback.com/WorshipService?version=2&null&_=1386201207191的AJAX调

  • 问题内容: 这让我很精神。 我在Google Maps v3中使用了MarkerCluster,它在FF中可以正常工作,但是当我(和客户端)在Chrome或Safari中启动它时,群集就不存在了。 没有错误,只是不能在webkit中工作。 一些注意事项:它来自一些ajax加载的json,并且在jquery中。 该函数负责添加: 干杯! 重申一下,Chrome中没有错误,只是没有显示。 问题答案:

  • 问题内容: 我有以下ajax调用,该调用在Firefox和Chrome中完美运行,但在IE中则不行: 我知道一个事实,所有变量都传递正确的内容,而$ .ajax确实传递所有参数/值。 这就是我遇到的错误: 日志:@错误:未定义日志:@状态:parsererror日志:@状态文本:确定 我知道IE上的缓存问题,并实施了一个随机参数来清除它。 这是我得到的JSON(我可以使用Charles看到它) 最

  • 问题内容: 在旋转动画中,只能在Chrome浏览器中使用,而不能在Firefox中使用。为什么? 问题答案: 当前的Firefox实施失败,除非时间值具有单位。使用或。 注意:W3C明确允许数字0(不带单位)作为长度值,但对于其他值则没有这种意义。我个人希望这种情况有所改变,但目前Firefox的行为并不正确。