0

我不是 jQuery，所以这可能是我的问题，但我想使用它：

http://jsfiddle.net/hGcV2/1/

但是唯一的问题是我什至无法让它在 jsfiddle 之外工作。我之前已经实现了 jQuery，所以我认为这没有什么不同，但似乎我对此的了解不足正在让我变得最好。

HTML

<head>

<link rel="stylesheet" href="awwyea.css" type="text/css" media="all" >

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js">
</script>
<script src="yay.js"></script>
</head>
<body>
<div id="cycler">      
<div>A</div>        
<div>B</div>        
<div>C</div>        
<div>D</div>        
<div>E</div>        
<div>F</div>        
<div>G</div>        
<div>H</div>        
<div>J</div>      
</div>
</body>
</html>

CSS

#cycler{
  height:5em;
  overflow:hidden;
  border:1px solid gray;
}​

jQuery

function cycle($item, $cycler){
setTimeout(cycle, 2000, $item.next(), $cycler);

$item.slideUp(1000,function(){
    $item.appendTo($cycler).show();        
});

 }

cycle($('#cycler div:first'),  $('#cycler'));​

简单地说，为什么当我使用notepad++在浏览器（chrome IE FF）中运行这段代码时，所有文件都在同一个文件夹中，我只是有一个静态的无滚动：

A B C D

有些东西不工作。

4

1 回答 1

2

不能真正为此归功于...我认为 j08691 做到了。

您需要将代码放入 jQuery 就绪调用中，因为当脚本尝试运行时元素尚未加载。您已将脚本 (yay.js) 加载到头部（在正文中的 HTML 元素之前）。所以脚本失败了。

在 yay.js 中，您只需像这样包装开始代码（任何需要 HTML 文档完成加载的内容）：

jQuery(document).ready(function(){
    cycle($('#cycler div:first'),  $('#cycler'));​
});

或简写语法

jQuery(function(){
    cycle($('#cycler div:first'),  $('#cycler'));​
});

默认情况下，JSFiddle 会将所有 JavaScript 代码放在窗口 onload 上运行。您可以通过简单地更改 Javascript 包装方法使 JSFiddle 在本地像您的 HTML 文档一样工作。

如果将其更改为“no wrap (head)”，则需要添加 jQuery 文档就绪函数或窗口加载以使示例也可以在 JSFiddle 中工作。

在此处输入图像描述

于 2012-11-10T22:21:21.790 回答