为什么我的 jQuery 代码在 Firefox 和 Chrome 中不起作用？

Question

已编辑

您好，我使用母版页。我在我的项目中使用表单验证。我从 SQL Server 2005 中提取数据。然后在 login.aspx 中，我从 jQuery 调用我的 pagemethod。毕竟，我在 IE9.0、Chrome 和 Firefox 中运行我的项目。该项目是正确的。但是这个 jQuery 代码只适用于 IE9.0。

我的名为 LoginService 的页面方法返回“0”或 returnURL，如“user/Default.aspx”，然后我控制这个 tah 如果 LoginService 的返回不是“0”成功将运行以下内容：

alert("there isnt error: " + msg.d);

但是，如果有错误，这将运行：

alert("there is error: " + msg.d);

这很有趣

如果我在 IE9 中运行这个项目，消息显示为“没有错误：user/Default.aspx”

但是，

如果我在 Chrome 或 Firefox 中运行此项目，则会显示类似“存在错误：未定义”的消息

如何在所有浏览器中运行这个项目？

<script type="text/javascript">
  jQuery(document).ready(function () {
    jQuery("#myContent_login").focus();
    jQuery("#myContent_submit_image").click(function () {
      jQuery("#login_form_spinner").show();
      jQuery.ajax({
        type: "POST",
        url: "Logon.aspx/LoginService",
        data: "{'username': '" + jQuery("#myContent_login").val() + "', 'password': '" + jQuery("#myContent_password").val() + "','isRemember': '" + jQuery("#myContent_remember_me").is(':checked') + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
          if (msg.d != 0) {
            alert("there isnt error: " + msg.d);
          }
        },
        error: function (msg) {
          alert("have error: " + msg.d);
        }
      });
    });
  });
</script>

Answer 1

只是一个快速的观察：

jQuery('login_form_spinner')

您需要在login_form_spinner 前面加上# 或.。

更新：

您可以查看here 的示例。请注意，成功和错误功能与您的示例不同。

我可以提供更多帮助，但需要知道具体错误。

Answer 2

确保从单击处理程序返回 false 以取消默认提交：

jQuery("#myContent_submit_image").click(function () {

    jQuery('#login_form_spinner').show();
    jQuery.ajax({
        type: "POST",
        url: "Logon.aspx/LoginService",
        data: "{'username': '" + jQuery("#myContent_login").val() + "', 'password': '" + jQuery("#myContent_password").val() + "','isRemember': '" + jQuery("#myContent_remember_me").is(':checked') + "'}",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            if (msg.d != 0) {
                window.location.replace(msg.d);
            }
        },
        error: function (msg) {
            alert(msg.d);
        }
    });

    return false; // THIS IS VERY IMPORTANT
});

同时清理您的 AJAX 调用以正确编码参数，如下所示：

jQuery("#myContent_submit_image").click(function () {
    jQuery('#login_form_spinner').show();
    jQuery.ajax({
        type: "POST",
        url: "Logon.aspx/LoginService",
        data: JSON.stringify({
            username: jQuery("#myContent_login").val(), 
            password: jQuery("#myContent_password").val(),
            isRemember: jQuery("#myContent_remember_me").is(':checked')
        }),
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (msg) {
            if (msg.d != 0) {
                window.location.replace(msg.d);
            }
        },
        error: function (msg) {
            alert(msg.d);
        }
    });

    return false; // THIS IS VERY IMPORTANT
});

Answer 3

就像贾斯汀说的那样，你缺少 has 或 dot 也会对你的数据对象进行疯狂的更改

<script type="text/javascript">
jQuery(document).ready(function ($) {
    $("#myContent_login").focus();
    $("#myContent_submit_image").click(function () {
        $('#login_form_spinner').show();
        $.ajax({
            type: "POST",
            url: "Logon.aspx/LoginService",
            data: {
                "username":$("#myContent_login").val(),
                "password":$("#myContent_password").val(),
                "isRemember":$("#myContent_remember_me").is(':checked')
            },
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                if (msg.d != 0) {
                alert("there isnt error: " + msg.d);
                }
            },
            error: function (msg) {
                alert("have error: " + msg.d);
            }
        });
    });
});
</script>

但我怀疑你没有返回 json 标头或类似的东西

Answer 4

仔细检查 jQuery.ajax 的文档，您会发现 success 和 error 使用不同的参数：

success(data, textStatus, jqXHR)
error(jqXHR, textStatus, errorThrown)

所以你的错误处理程序应该是这样的：

error: function (jqXHR, status, error) {
    alert("have error: " + status);
}

成功收到错误消息后，您可以找出导致错误的原因。

Answer 5

在这一行

jQuery('login_form_spinner').show();

是帖子中的错字还是您的原始代码中的错字？ 我假设您的选择器缺少“#”。由于 IE 处理这种错误的方式与 FF 和 Chrome 不同。您会在不同的浏览器中获得不同的行为。