【问题标题】:iScroll conflictiScroll 冲突
【发布时间】:2013-05-04 02:03:21
【问题描述】:

iPad 上 Mobile Safari 中的 HTML5 模板。带有 iScroll 的 Div 工作正常。 if/else 语句中还包含一个 jQuery 函数。该函数测试用户是否在 iScroll div 之外点击,如果是,则淡化 iScroll div。
问题是,如果用户在页面上的第二个 div 之外点击,if/else 语句可以很好地作为测试,但如果用户在 iScroll div 之外点击,则不能作为测试。不知道为什么,在 if/else 语句中尝试了所有与 iScroll div 关联的 div ID,但效果不佳。
函数如下:

var articleBodyEl = document.getElementById('content');
articleBodyEl.addEventListener("touchend", function() {
var $target = $(event.target);
if ($target.is('ul#article_images') || $target.is('ul#article_images li') || $target.is('div#article')) {
    //do nothing
} else {
    $('#article').fadeToggle('fast');
}
});

#article = iScroll div

#article_images = 页面上的单独 div,测试用户是否在此 div 外部单击工作正常。
HTML:

<div id="article">
<div id="article_content">
   <div id="scroller">
   <div id="text_1" class="article_text">
    <h4>Wish you were here</h4>
    <p>Sometimes we stumble upon a photograph that requires no words whatsoever. An image that proves the ancient adage that a good picture is worth a thousand words (and probably more, if some of them are small words like ‘if’, ‘it’ and ‘er’). </p>
   </div>
   </div>
</div>
</div>

【问题讨论】:

    标签: jquery ipad iscroll


    【解决方案1】:

    尝试将 if/else 替换为以下内容,

    if (!$target.is('div#article')) { 
        $('div#article').fadeToggle('fast');
    }
    

    如果内容 div 是 iScroll div 的父级,那么您可能必须在 iScroll 的 touchend 事件上停止传播。

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 2017-03-22
      • 2011-11-22
      • 2016-02-25
      • 2011-08-04
      • 2021-06-17
      • 1970-01-01
      相关资源
      最近更新 更多