0

我在让我的脚本正常工作方面遇到了全面的问题。它们在 jsFiddle 中运行良好，但是当我将它们带入站点时，我没有看到脚本生效。

我的问题是，将脚本实现到页面中的最佳实践是什么？是否不赞成复制/粘贴？

作为参考，这里是工作的 jsfiddle http://jsfiddle.net/j08691/TgFvP/15/，我没有看到效果发生的页面http://www.tailwatersflyfishing.com/sage-fly-棒

我对此非常陌生，所以我确定这是我所缺少的标准。有什么建议么？

谢谢！

4

5 回答 5

0

您的脚本无法正常工作，因为您遇到了阻止所有内容完全加载的错误。您需要打开控制台才能看到它们。我要开始的第一个地方是w3c 验证器，以确保您的标记是干净的（目前存在验证问题）。

于 2012-03-12T17:17:57.220 回答
0

如果您运行 firebug 或其他开发人员工具套件，您会发现缺少一个大括号。

你在网站上有这个...

$('document').ready(function(){
    $('.rod-list').hover(function() {
        $('.rod-list', this).slideToggle('fast');
    }, function() {
        $('.rod-list', this).slideToggle('fast');
});

你需要的是这个......

$('document').ready(function(){
    $('.rod-list').hover(function() {
        $('.rod-list', this).slideToggle('fast');
    }, function() {
        $('.rod-list', this).slideToggle('fast');
    });
});
于 2012-03-12T17:19:47.820 回答
0

jQuery 脚本应该包含在

$(function() {
...
...
}

因为只有在 DOM 准备好时才需要执行 jQuery 函数。

于 2012-03-12T17:17:05.340 回答
0

您对该代码段的问题尤其是您错过了});该$(document).ready()块的关闭；

<script type="text/javascript">
$('document').ready(function(){

    $('.rod-list').hover(function(){
       $('.rod-list', this).slideToggle('fast');
    }, function() {
       $('.rod-list', this).slideToggle('fast');
    });
// Add }); here!
</script>

但是，对您来说更大的问题是您还在页面中包含 PrototypeJS，它会覆盖$自己成为自己的特殊事物；所以即使你修复了，<script>你也会得到一个不能调用方法'ready'的空错误。

要解决此问题，您需要使用以下内容；

<script type="text/javascript">
jQuery('document').ready(function($){

    $('.rod-list').hover(function(){
       $('.rod-list', this).slideToggle('fast');
    }, function() {
       $('.rod-list', this).slideToggle('fast');
    });

});
</script>

此用途jQuery()尚未被 Prototype 覆盖，因此仍然有效。在 ready 处理程序内部，我们然后传递 a $，以便在ready 处理程序内部，您可以将$其用作 jQuery 的方便别名，但在就绪处理程序之外，$将是 Prototype。

于 2012-03-12T17:17:18.443 回答
0

这是您需要的就绪代码：

$(function () {
    $('.rod-list').hover(function () {
        $('.rod-list', this).slideToggle('fast');
    }, function () {
        $('.rod-list', this).slideToggle('fast');
    });
});

看起来该页面也可能有其他错误。

边注：

$(function () {

是一个快捷方式：

$(document).ready(function() {
于 2012-03-12T17:27:37.637 回答