jQuery(document).ready(function () {
//alert("HIQ");
$('.mySelectCalendar').datepicker({ firstDay: 1, dateFormat: "dd.mm.yy" });
$.validator.addMethod(
'date',
function (value, element, params) {
if (this.optional(element)) {
return true;
};
var result = false;
try {
$.datepicker.parseDate('dd.mm.yy', value);
result = true;
} catch (err) {
result = false;
}
return result;
},
''
);
});
我收到错误为“Uncaught TypeError:无法读取未定义的属性'addMethod'”
_layout as this
@ ViewBag.Title
<!-- jQuery -->
<script src="~/App_Themes/ThemeBlue/assets/js/jquery203.js"></script>
<script src="~/App_Themes/ThemeBlue/assets/js/jquery.min.js"></script>
<script type="text/javascript">
var jQuery_2_0_3 = $.noConflict(true);
</script>
<!-- Picker UI-->
<script src="~/App_Themes/ThemeBlue/assets/js/jquery-ui.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.1/jquery-ui.js"></script>
<!--Validation -->
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="~/Scripts/jquery.unobtrusive-ajax.js"></script>
<link href="~/App_Themes/ThemeBlue/css/validation.css" rel="stylesheet" />
<script type="text/javascript">
var jQuery_1_7_0 = $.noConflict(true);
</script>
<!-- Bootstrap -->
<link href="~/App_Themes/ThemeBlue/dist/css/bootstrap.css" rel="stylesheet" media="screen" />
<link href="~/App_Themes/ThemeBlue/assets/css/custom.css" rel="stylesheet" media="screen" />
<!-- bin/jquery.slider.min.js -->
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jshashtable-2.1_src.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jquery.numberformatter-1.2.3.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/tmpl.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jquery.dependClass-0.1.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/draggable-0.1.js"></script>
<script type="text/javascript" src="~/App_Themes/ThemeBlue/plugins/jslider/js/jquery.slider.js"></script>
<!-- Javascript -->
<script src="~/App_Themes/ThemeBlue/assets/js/initialize-loginpage.js"></script>
<script src="~/App_Themes/ThemeBlue/assets/js/jquery.easing.js"></script>
<script src="~/App_Themes/ThemeBlue/assets/js/customTravel.js"></script>
<!-- Load Animo -->
<script src="~/App_Themes/ThemeBlue/plugins/animo/animo.js"></script>
<script src="~/App_Themes/ThemeBlue/dist/js/bootstrap.min.js"></script>
<!-- Carousel -->
<link href="~/App_Themes/ThemeBlue/examples/carousel/carousel.css" rel="stylesheet" />
<!-- HTML5 shim and Respond.js IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="assets/js/html5shiv.js"></script>
<script src="assets/js/respond.min.js"></script>
<![endif]-->
<!-- Fonts -->
<link href='http://fonts.googleapis.com/css?family=Lato:400,100,100italic,300,300italic,400italic,700,700italic,900,900italic' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:700,400,300,300italic' rel='stylesheet' type='text/css'>
<!-- Font-Awesome -->
<link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/assets/css/font-awesome.css" media="screen" />
<!--[if lt IE 7]><link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/assets/css/font-awesome-ie7.css" media="screen" /><![endif]-->
<!-- REVOLUTION BANNER CSS SETTINGS -->
<link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/css/fullwidth.css" media="screen" />
<link rel="stylesheet" type="text/css" href="~/App_Themes/ThemeBlue/rs-plugin/css/settings2.css" media="screen" />
<!-- Picker UI-->
<link rel="stylesheet" href="~/App_Themes/ThemeBlue/assets/css/jquery-ui.css" />
<!-- bin/jquery.slider.min.css -->
<link rel="stylesheet" href="~/App_Themes/ThemeBlue/plugins/jslider/css/jslider.css" type="text/css">
<link rel="stylesheet" href="~/App_Themes/ThemeBlue/plugins/jslider/css/jslider.round.css" type="text/css">
<!-- Animo css-->
<link href="~/App_Themes/ThemeBlue/plugins/animo/animate_animo.css" rel="stylesheet" media="screen">
<!-- end -->
我在MVC中编写Web应用程序并无法解决此问题。
你能帮我吗?
答案 0 :(得分:15)
您的错误:
未捕获的TypeError:无法读取属性&#39; addMethod&#39;未定义的
它只是意味着JavaScript无法找到addMethod
方法,该方法内置于jQuery Validate插件中。没有正确包含jQuery或jQuery Validate ...无法找到文件或jQuery被破坏......
你的头部是乱七八糟的jQuery和.noConflict()
应用不一致。
请注意在包含此特定版本的jQuery之后您是如何定义.noConflict()
的?
<!--Validation -->
<script src="~/Scripts/jquery-1.7.1.min.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
....
<script type="text/javascript">
var jQuery_1_7_0 = $.noConflict(true); // <- this
</script>
因此,对于验证部分,名称jQuery_1_7_0
必须在验证码中替换每个实例$
。
jQuery_1_7_0(document).ready(function () {
jQuery_1_7_0.validator.addMethod( ....
我只指出了一个例子。您还在验证部分上方添加了一个没有.noConflict()
的jQuery版本。
需要解决这些多个版本的jQuery,方法是删除重复项并保留一个版本,或者在包含每个版本后正确使用.noConflict()
。
IMO,最好只使用一个版本的jQuery。
答案 1 :(得分:2)
添加jquery.validate.js
文件和jquery.min.js
(如果您尚未包含),然后编写您的js代码以添加&#39; addMethod&#39;方法
答案 2 :(得分:0)
对我来说,当我将$.validator.addMethod
方法从移出 $(document).ready(function(){
时,它是固定的!
无需使用noConflict()方法...
如果您使用Webpack(或像我这样的Laravel mix),请检查已编译js的顺序,有时它将验证器放在jquery之前,这会导致此错误