Javascript ASP.NET MVC4-JQuery jqFancyTransitions错误：TypeError:$（…）。jqFancyTransitions不是函数

我有我的Index.cshtml视图，出于某种原因，JQuery很难启动jqFancyTransitions方法（它的作用就像没有包含jqFancyTransitions库一样）。JavaScript正在启动。为了进行测试，我甚至把

$（'#rotatingImages'）.html（'blah'）

查看它是否会找到我的ID并替换它的HTML内容，但它没有

我在Firebug控制台中确实收到一个JS错误：

TypeError:$（…）。jqFancyTransitions不是一个函数

。然而，在括号末尾键入一个点后，我得到了jqFancyTransitions intellisense

编辑：

jqFancyTransitions.js库实际上是根据Firebug加载到浏览器中的。为了测试它，我删除了对它的引用，然后我没有看到库被加载。我把它添加回我的视图中，我看到了它

以下是Index.cshtml上的代码：

<script src="~/Scripts/jqFancyTransitions.1.8.js"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $('#rotatingImages').jqFancyTransitions({
            effect: 'wave', // wave, zipper, curtain
            width: 959, // width of panel
            height: 300, // height of panel
            strips: 20, // number of strips
            delay: 4000, // delay between images in ms
            stripDelay: 50, // delay beetwen strips in ms
            titleOpacity: 0.7, // opacity of title
            titleSpeed: 1000, // speed of title appereance in ms
            position: 'alternate', // top, bottom, alternate, curtain
            direction: 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate
            navigation: false, // prev and next navigation buttons
            links: false // show images as links
        });

        // $('#rotatingImages').html('blah'); // just for testing
    });
</script>

<div id="rotatingImages">
    <img src="Images/Background/bg1.jpg" />
    <img src="Images/Background/bg2.jpg" />
    <img src="Images/Background/bg3.jpg" />
    <img src="Images/Background/bg4.jpg" />
</div>

$（文档）.ready（函数（）{
$（“#旋转图像”）.jqFancyTransitions({
效果：'波浪'，//波浪，拉链，窗帘
宽度：959，//面板宽度
高度：300，//面板高度
条数：20，//条数
延迟：4000，//图像之间的延迟（毫秒）
stripDelay:50，//以毫秒为单位延迟条带
标题容量：0.7，//标题的不透明度
标题速度：1000，//标题出现的速度（毫秒）
位置：'备用'，//顶部、底部、备用、窗帘
方向：'喷泉三角形'，//左，右，交替，随机，喷泉，喷泉三角形
导航：false、//上一个和下一个导航按钮
链接：false//将图像显示为链接
});
//$（'#rotatingImages'）.html（'blah'）；//仅用于测试
});

---

知道发生了什么吗？

我想你忘了在顶部链接jQuery库。以前

<script src="~/Scripts/jqFancyTransitions.1.8.js"> </script>

---

我认为您的JavaScript引用需要更改为

<script src="@Url.Content("~/Scripts/jqFancyTransitions.1.8.js")"></script>

用于Razor ViewEngine，或

<script src="<%=Url.Content("~/Scripts/jqFancyTransitions.1.8.js")%>"></script>

---

用于WebForms ViewEngine。

非常简单。我所要做的就是在我工作的视图（Index.cshtml）中的“scripts”部分包含我的脚本，如下所示：

@section scripts
{
    @Scripts.Render("~/bundles/fancyTransitions")
    <script type="text/javascript">
        $(document).ready(function () {
            $('#rotatingImages').jqFancyTransitions({
                effect: 'wave', // wave, zipper, curtain
                width: 959, // width of panel
                height: 300, // height of panel
                strips: 20, // number of strips
                delay: 4000, // delay between images in ms
                stripDelay: 50, // delay beetwen strips in ms
                titleOpacity: 0.7, // opacity of title
                titleSpeed: 1000, // speed of title appereance in ms
                position: 'alternate', // top, bottom, alternate, curtain
                direction: 'fountainAlternate', // left, right, alternate, random, fountain, fountainAlternate
                navigation: false, // prev and next navigation buttons
                links: false // show images as links
            });
        });
    </script>
}

@节脚本
{
@Scripts.Render（“~/bundles/fancyTransitions”）
$（文档）.ready（函数（）{
$（“#旋转图像”）.jqFancyTransitions({
效果：'波浪'，//波浪，拉链，窗帘
宽度：959，//面板宽度
高度：300，//面板高度
条数：20，//条数
延迟：4000，//图像之间的延迟（毫秒）
stripDelay:50，//以毫秒为单位延迟条带
标题容量：0.7，//标题的不透明度
标题速度：1000，//标题出现的速度（毫秒）
位置：'备用'，//顶部、底部、备用、窗帘
方向：'喷泉三角形'，//左，右，交替，随机，喷泉，喷泉三角形
导航：false、//上一个和下一个导航按钮
链接：false//将图像显示为链接
});
});
}

这些是偶然的ASP控件吗？不，它们不是。。。它们只是普通的HTML控件。我简单地想到了ClientIDMode，但我记得它仅在ASP控件上可用，并且仅在执行document.getElementById时使用。控制台中有任何错误吗？很好。。。我没想到要检查控制台。我得到“TypeError:$（…）。jqFancyTransitions不是一个函数”。我会调查的。我猜JS甚至没有进入这个功能。检查你的代码（例如，通过chrome）：按F12，在元素选项卡中，查找jqFancyTransitions JS调用，右键打开脚本的链接，选择“复制链接地址”，粘贴到另一个浏览器选项卡中，看看脚本是否正确加载。不，我没有，jquery库在我的母版页中被引用，_Layout.cshtml.Plus，它识别$syntax，这就是jquery，因此基本jquery库被加载并工作。