从JSFiddle复制代码

Copy the code from JSFiddle

本文关键字：代码 复制 JSFiddle      更新时间：2023-09-26

很抱歉问了这个愚蠢的问题。。。我发现了其他类似的问题，但我想不通。

我不明白为什么它不起作用。我从复制代码http://jsfiddle.net/sB49B/21/

我认为问题应该是加载，但我不确定，因为我尝试的都不起作用。我决定将代码包括在：中

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

和：

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

你有什么想法吗？？！这是错误：未捕获的语法错误：意外的令牌）

这里的代码：

<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>

是的，错误来了，因为你没有正确地关闭括号

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

应该是

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

注意最后一行之间的差异

让我们读一下错误。。。意外的令牌）。。。嗯，也许是一个错位的）角色。

$(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);
    });
});

您的最后一行)};错误。应该是});，首先关闭的是function() {的}，然后是.ready(的)。

尝试这个

<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>

并检查控制台，寻找"就绪！"如果您看到它，问题就出在逻辑

上
相关文章：