iScroll-未捕获引用错误:myScroll未在索引中定义，并且从webcore接收到过时触摸事件ACTION_DO

我在我的级别页面中使用了iScroll，但不知何故，我的编辑器在我的索引页面（另一个页面）中抱怨ReferenceError，而我没有使用iScroll。我在索引中搜索"myScroll"，但在索引中没有这样的词。由于这个错误，我在浏览器中工作的iScroll在Android模拟器中不工作。

09-04 08:31:06.249: E/Web Console(942): Uncaught ReferenceError: myScroll is not defined at file:///android_asset/www/index.html:1

如果我在模拟器中滑动，它会产生

09-04 15:58:57.318: W/webview(3045): Stale touch event ACTION_DOWN received from webcore; ignoring

index.html（我没有使用iScroll）

<!DOCTYPE html>
<html>
<head>
<title>App Name</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0">
<link rel="stylesheet" href="css/jquery.mobile-1.0rc1.min.css" />
<link rel="stylesheet" href="css/style.css" />
</head>
<body>        
<div id="mainContainer" data-role="page" >
<div data-role="content">
    <div id="homeLinks">
    <img id="icon" src="css/images/icon.png">
    <p><a href="#level" data-role="button" data-theme="a">level</a></p>
    </div>   
  </div>        
</div>
<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.0rc1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/cordova-1.7.0.js"></script>
</body>
</html>

级别页面（我使用iScroll的页面）

<div data-role="page" data-add-back-btn="true" >
<header data-role="header">  
    <a href="settings.html" data-icon="gear" data-theme="b" class="ui-btn-right">Settings</a>  
    <h1>Study Levels</h1>  
</header>
<div id="level1" data-role="content">
    <div id="wrapper">
        <div id="scroller">
             <ul id="thelist">
                  <li><img src="css/images/level1.png"/></li>
                  <li><img src="css/images/level2.png"/></li>
                  <li>zz</li>
            </ul>
        </div>
    </div>
</div>      
<footer data-role="footer" data-position="fixed" data-tap-toggle="false">
    <div id="nav">
      <div id="prev" onclick="myScroll.scrollToPage('prev', 0);return false">&larr; prev</div>
      <ul id="indicator">
        <li class="active">1</li>
        <li>2</li>
        <li>3</li>
      </ul>
      <div id="next" onclick="myScroll.scrollToPage('next', 0);return false">next &rarr;</div>
    </div>
</footer>

<script src="js/jquery.js"></script>
<script src="js/jquery.mobile-1.0rc1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="js/cordova-1.7.0.js"></script>
<script src="js/ender.js"></script>
<script type="text/javascript" src="iscroll-lite.js"></script>
<script type="text/javascript" charset="utf-8">
         $(document).ready(function () {
        this.myScroll = $('#wrapper').iScroll({
        snap: true,
        momentum: false,
       hScrollbar: false,
        onScrollEnd: function () {
          document.querySelector('#indicator > li.active').className = '';
          document.querySelector('#indicator > li:nth-child(' + (this.currPageX+1) + ')').className = 'active';
        }
        })
    })
 </script>
</body>

----更新------

再看一看，$in$（'#wrapper'）。iScroll…来自ender，而不是jQuery，我认为这会引起冲突。

所以你可能想要创建一个闭包，像这样：

  (function($){
      $(document).ready(function() {
           this.myScroll = $('#wrapper').iScroll({
           //custom options here 
           });
      });
  })(ender);

由于enders document.ready函数中的"this"指向窗口对象

您可以简单地传递这样的内联事件处理程序：

 <div id="prev" onclick="myScroll.scrollToPage('prev', 0);return false"> stuff </div>

希望有帮助：）

您已经将myScroll变量绑定到文档。因此，您可以通过调用document.myScroll将其绑定到我们，也可以通过用window替换this将其绑定至window（或者将其删除），使其变为：

window.myScroll = $('#wrapper') ...

然后你可以把它称为一个正则变量。

相关内容

最新更新

热门标签：