未捕获的类型错误：未定义不是函数。 ASP.NET Web 窗体中的 JQuery 验证答案

【问题标题】：Uncaught TypeError: undefined is not a function. JQuery validation in ASP.NET Web Form未捕获的类型错误：未定义不是函数。 ASP.NET Web 窗体中的 JQuery 验证
【发布时间】：2014-06-12 09:33:52
【问题描述】：

我正在尝试使用 jQuery 验证来验证 ASP.NET Web 表单

在 Site.Master 我包含这些脚本

<script src="/Scripts/jquery-1.4.4.js"></script>
<script src="/Scripts/jquery-1.4.4.min.js"></script>
<script src="/Scripts/jquery.validate.js"></script>
<script src="/Scripts/jquery.validate.min.js"></script>

在 Modify.aspx 中，我包含了一个自定义脚本

<script type="text/javascript">
    $(document).ready(function () {
        $('#<%= Form.ClientID%>').validate({
            highlight: function (element) {
                $(element).addClass('has-error');
            },
            unhighlight: function (element, errorClass, validClass) {
                $(element).removeClass('has-error');
            }
        });
    }(jQuery));
</script>

如您所见，我正在尝试为经过验证的输入添加或删除 css 类。

然后我得到一个错误

Uncaught TypeError: undefined is not a function

谁能帮我解决这个问题？也许脚本也不正确，请帮我修改它。非常感谢！

【问题讨论】：

确保客户端 ID 不为空/null，var clientId = '#'; console.log(clientId);
是的，它不为空。它返回 $('form1').validate
为什么要加载所有库的开发和缩小版本？为什么要使用这么古老的 jQuery 版本？
浏览器的开发者工具应该告诉你什么未定义的东西不是函数。您需要缩小问题范围。
元素里面的高亮和取消高亮怎么样， var $element = $(element); console.log($element);

标签： javascript jquery asp.net validation

【解决方案1】：

我同意其他人的观点，即您不应该使用已停用的库并在导入代码中混合使用完整版本和缩小版本的脚本。下面的代码 sn-p 应该让您抢先一步。添加了引导 css 参考化妆品。

 <script src="Scripts/jquery-1.10.2.min.js"></script>
 <script src="Scripts/jquery-validate.min.js"></script>
<link href="Scripts/vendor/bootstrap/css/bootstrap.min.css" rel="stylesheet" />

  <script type="text/javascript">
    $(document).ready(function () {
        $('#form1').validate({
            onKeyup: true,
            eachValidField: function () {

                $(this).closest('div').removeClass('error').addClass('success');
            },
            eachInvalidField: function () {

                $(this).closest('div').removeClass('success').addClass('error');
            }
    });
    });

 <form id="form1" runat="server" class="test">
<div class="control-group input-append">
<input type="text" data-required="true"/>
   <button type="submit" class="btn btn-primary">Send</button>
</div>
</form>

【讨论】：