jQuery.Validate remote验证失效？

时间：2010-09-07 来源：叶漂

　　最近使用jQuery.Validate客户端验证组件进行验证，在本机开发运行的时候似乎没有问题，但部署到服务器之后，就出现问题了。remote验证不能成功执行。我是远程调用Web服务验证用户名是否存在，用Fiddler跟踪后发现Web服务不能正确调用。是天灾还是人祸呢？本人对jQuery.Validate组件不是很熟悉。大家要记住：

是部署到服务器后，从其他机器访问才会出现问题，如果本机，无论是localhost还是IP地址都没有异常！

　　为了让大家清楚该问题，我把问题用简化后代码呈现出来。

代码 /// <reference path="jquery-1.4.1-vsdoc.js" />
/// <reference path="jquery.validate.js" />

jQuery(document).ready(function() {
    $('#form1').validate({
        rules: {
            txtUserName: {
                required: true,
                remote:
                {
                    type: "post",
                    url: "Services/WebServiceHelper.asmx/ExistUserName",
                    data:
                    {
                        name: function() {
                            return $("#txtUserName").val();
                        }
                    },
                    dataType: "xml",
                    dataFilter: function(dataXML) {
                        var result = $(dataXML).find("boolean").text();
                        if (result == "false") {
                            return true;
                        }
                        else
                            return false;
                    }
                }
            }
        },
        messages: {
            txtUserName: {
                required: "请填用户",
                remote: "已经存在"
            }
        }
    });
});

　　另外，remote验证应该也是封装了jQuery中的ajax()函数，但我直接测试ajax()函数，没有任何问题，这个地方才是我真不明白的地方，当然，jQuery以及jQUery.Validate的代码我都没有研究过。就像如下checkName()方法，部署后，还是可以正确运行，但txtUserName文本框使用remote验证，就不行了。

代码 <%@ Page Language="C#" AutoEventWireup="true"  CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="scripts/jquery-1.4.1-vsdoc.js" type="text/javascript"></script>
    <script src="scripts/jquery.validate.js" type="text/javascript"></script>
    <script src="scripts/jquery.validate.pack.js" type="text/javascript"></script>
    <script src="scripts/jQuery.validate.register.js" type="text/javascript"></script>

    <script type="text/javascript">
        function checkName(name) {
            $.ajax({
                type: "POST",   //访问WebService使用Post方式请求
                contentType: "application/json", //WebService 会返回Json类型
                url: "Services/WebServiceHelper.asmx/ExistUserName", //调用WebService的地址和方法名称组合---WsURL/方法名
                data: '{ name: "' + name + '" }',
                dataType: 'json',
                success: function(data) { alert(data.d); },
                error: function(XMLHttpRequest, textStatus, errorThrown) {

                }
            });
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        用户名：<asp:TextBox ID="txtUserName" runat="server"></asp:TextBox><br />
        姓名：<input id="txtName" type="text" onblur="checkName(this.value);" />
        <asp:Button ID="btnSave" runat="server" Text="保存" />
    </div>
    </form>
</body>
</html>

　　我在网上搜索过，似乎大家都没有碰到过类似的问题。难道这只是个案吗？