从JSFiddle复制代码

时间:2014-10-24 14:27:07

标签: javascript html css jsfiddle

对不起这个愚蠢的问题......我发现了其他类似的问题,但我无法弄清楚。

我不知道为什么它不起作用。我从http://jsfiddle.net/sB49B/21/

复制代码

我认为问题应该是上传,但我不确定,因为我尝试的并没有奏效。 我想把代码包含在:

jQuery(document).ready(function($){
  code javascript
)};

并在:

$(document).ready(function(){
  code javascript
)};

你有什么想法??!这是错误:Uncaught SyntaxError:Unexpected token)

这里是代码:

<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title>jsfiddle.net/sB49B/18/</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.js"></script>
    <script type="text/javascript">
      var oDebug = $('p#debug');
      var oItemsContainer = $('ul#items');
      $(window).scroll(function(e) {
        var iScrollTop = $(window).scrollTop();
        var iScrollPerItem = 200;
        var aItems = oItemsContainer.children('li.item');
        var iCurrentIndex = Math.floor(iScrollTop / iScrollPerItem);
        var fOpacity= (iScrollTop % iScrollPerItem) / iScrollPerItem ;
        aItems.filter(':lt(' + iCurrentIndex  + ')').show();
        aItems.filter(':gt(' + iCurrentIndex  + ')').hide();
        aItems.eq(iCurrentIndex).show().css('opacity', fOpacity);
      });
    </script>
    <style type="text/css">
      body { height:3000px; }
      ul#items { width:200px; height:200px; position:fixed; top:10px; left:10px; }
      ul#items li.item {background-color:#dddddd; display:block; height:100%; left:0; opacity:0; position:absolute; right:0; width:100%;}
      p#debug {position:fixed; right:10px; text-align:right; top:10px; }
    </style>
  </head>
  <body>
    <p id="debug">n/a</p>
    <ul id="items">
      <li class="item item01">1</li>
      <li class="item item02">2</li>
      <li class="item item03">3</li>
      <li class="item item04">4</li>
      <li class="item item05">5</li>
      <li class="item item06">6</li>
      <li class="item item07">7</li>
      <li class="item item08">8</li>
    </ul>
  </body>
</html>

3 个答案:

答案 0 :(得分:0)

是的,错误即将发生,因为您没有正确关闭括号

$(document).ready(function(){
  code javascript
)};

应该是

$(document).ready(function(){
      code javascript
    });

注意最后一行

之间的区别

答案 1 :(得分:0)

让我们读错误......意想不到的令牌......好吧,也许是一个错位的)。

$(document).ready(function() {
    var oDebug = $('p#debug');
    var oItemsContainer = $('ul#items');
    $(window).scroll(function(e) {
        var iScrollTop = $(window).scrollTop();
        var iScrollPerItem = 200;
        var aItems = oItemsContainer.children('li.item');
        var iCurrentIndex = Math.floor(iScrollTop / iScrollPerItem);
        var fOpacity= (iScrollTop % iScrollPerItem) / iScrollPerItem ;
        aItems.filter(':lt(' + iCurrentIndex  + ')').show();
        aItems.filter(':gt(' + iCurrentIndex  + ')').hide();
        aItems.eq(iCurrentIndex).show().css('opacity', fOpacity);
    });
});

您的上一行)};错了。它应该是});,关闭的第一个是}的{​​{1}},然后是function() {的{​​{1}}。

答案 2 :(得分:-1)

试试这个

<script type="text/javascript">
  $( document ).ready(function() {
  console.log( "ready!" );
  var oDebug = $('p#debug');
  var oItemsContainer = $('ul#items');
  $(window).scroll(function(e) {
    var iScrollTop = $(window).scrollTop();
    var iScrollPerItem = 200;
    var aItems = oItemsContainer.children('li.item');
    var iCurrentIndex = Math.floor(iScrollTop / iScrollPerItem);
    var fOpacity= (iScrollTop % iScrollPerItem) / iScrollPerItem ;
    aItems.filter(':lt(' + iCurrentIndex  + ')').show();
    aItems.filter(':gt(' + iCurrentIndex  + ')').hide();
    aItems.eq(iCurrentIndex).show().css('opacity', fOpacity);
  });
 }
</script>

并检查控制台是否准备就绪!&#34; 如果你看到它,问题在于逻辑