JQuery Cycle 插件在 ASP.NET Masterpage 中不起作用答案

【问题标题】：JQuery Cycle plugin doesn't work inside ASP.NET MasterpageJQuery Cycle 插件在 ASP.NET Masterpage 中不起作用
【发布时间】：2012-02-16 20:27:10
【问题描述】：

我有一个使用 Masterpages 的 .NET 网站。我正在尝试在我的 Masterpage 上的菜单中添加一些功能，允许用户将鼠标悬停在一些在后面的代码中构建的动态链接上，并根据用户鼠标悬停的内容进行另一个动态内容区域更新以显示内容。

为了实现这一点，我试图让一个 JQuery 图像旋转器（Cycle 插件http://jquery.malsup.com/cycle/）工作。我也尝试过使用 JQueryUI 做类似的事情。

我的问题是，当这段代码在母版页上时，它永远不会起作用，但如果我把它放在我网站的任何其他页面上，那就没问题了。我没有在头文件中使用指向脚本文件的相对链接。

谁能帮我弄清楚为什么我不能让 JQuery 在母版页上运行？

我的 JQuery Cycle 标头内容如下。

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<script type="text/javascript" src="http://malsup.github.com/jquery.cycle.all.js"></script>

<script type="text/javascript">
$(document).ready(function () {
    $('#slideshow').cycle({
        fx: 'turnDown',
        speed: 'fast',
        timeout: 0,
        pager: '#nav',
        pagerAnchorBuilder: function (idx, slide) {
            // return sel string for existing anchor
            return '#nav li:eq(' + (idx) + ') a';
        }
    });
});
</script>

【问题讨论】：

标签： jquery asp.net jquery-ui jquery-cycle

【解决方案1】：

我认为问题在于脚本的加载顺序。

可能是您在一个不存在的元素上调用了某些东西，因此在您初始化它时尚未创建 Cycle Plugin。

如果您有 Ajax，您可能会考虑使用脚本管理器，但这不是必需的。

加载顺序为：

1) Jquery 加载到母版页上。 2) Content Page 被合并并触发 Content Header 脚本。 3) 从 Master 调用 Document.ready 4) Document.ready 从内容页面调用

如果您输入一些警报，您可以追踪您的 $('#slideshow').cycle() 调用是否在正确的时间进行。您需要确保#slideshow 存在。

有关脚本管理器解决方案，请参阅此帖子： Proper way to use JQuery when using MasterPages in ASP.NET?

基本上：

1) Add Scriptmanager to your Master Page

2) Add a reference to the Jquery library before your Content Page document.ready()

3) Use your document.ready code above as it is, but do not include the references to the library or plugin files. Those belong on the master.

我知道这是一篇较旧的帖子。但我认为这是一个普遍的问题。

【讨论】：