"not a function" error when referencing jquery library in ASP.NET MVC View with Telerik MVC Extensions
In the script below, the .cluetip() function call results in "$(".tip").cluetip is not a function". I'm certain that the library is properly referenced b/c I can follow the link from the source. Also, the .click() function works fine. What am I missing? Many thanks!
<script src="@Url.Content("~/Scripts/jquery.validate.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.min.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jqu开发者_如何转开发ery.cluetip.js")" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
$(".tip").click(function () { alert('hi mom!'); }); // this works
$(".tip").cluetip(); // results in $(".tip").cluetip is not a function
});
</script>
There was a jQuery conflict. The Telerik MVC extension templates automatically add the following line to _layout.cshtml:
@(Html.Telerik().ScriptRegistrar()
.DefaultGroup(group => group.Combined(true).Compress(true))
At the time of this writing, this statement will add jQuery version 1.5.1. By default, jQuery is also included at the top of the _layout.cshtml file:
<script src="@Url.Content("~/Scripts/jquery-1.4.4.min.js")" type="text/javascript"></script>
Hence, a conflict.
Solution
The way I solved this was to include jQuery version 1.5.1 in the <head>
section:
<script src="@Url.Content("~/Scripts/jquery-1.5.min.js")" type="text/javascript"></script>
And then suppress the jQuery output from Telerik:
@(Html.Telerik().ScriptRegistrar()
.DefaultGroup(group => group.Combined(true).Compress(true))
.jQuery(false))
精彩评论