iPad上的Mobile Safari中的HTML5模板。使用iScroll的Div工作正常。还有一个包含在if / else语句中的jQuery函数。该函数测试用户是否在iScroll div之外点击,如果是,则淡出iScroll div。
问题是,if / else语句作为测试工作正常,如果用户在页面上的第二个div之外点击但是如果用户在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>
答案 0 :(得分:0)
尝试使用以下内容替换if / else,
if (!$target.is('div#article')) {
$('div#article').fadeToggle('fast');
}
如果内容div是iScroll div的父级,则可能需要在iScroll的touchend事件上停止传播。