Fastclick干扰jQuery移动非本机选择

Question

我正在使用Fastclick和jQuery Mobile,除了一些非原生选择之外它们都工作正常,现在需要两次点击(不是双击)才能激活.

我在添加Fastclick之前将'needsclick'类添加到select的所有元素,试图让Fastclick忽略选择:

        $("div.ui-select").addClass("needsclick");
        $("#searchPanel .ui-btn-inner").addClass("needsclick");
        $("#searchPanel a").addClass("needsclick");
        $("#searchPanel select").addClass("needsclick");
        bindFastClick();

这在标记中有所期望的效果,用'needsclick'闪现整个事物:

<div id="searchPanel">
.....

<a href="#" role="button" id="searchLocationSlct-button" aria-haspopup="true" aria-owns="searchLocationSlct-menu" data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="span" data-icon="arrow-d" data-iconpos="right" data-theme="c" data-inline="true" data-mini="true" class="ui-btn ui-mini ui-btn-inline ui-btn-icon-right needsclick ui-btn-up-c">
     <span class="ui-btn-inner needsclick">
        <span class="ui-btn-text">
             <span class="needsclick">Location</span>
        </span>
        <span class="ui-icon ui-icon-arrow-d ui-icon-shadow">&nbsp;</span>
    </span>
</a>
<select name="searchLocationSlct" class="needsclick" id="searchLocationSlct" data-mini="true" data-inline="true" data-shadow="false" data-corners="false" data-native-menu="false" tabindex="-1">
    <option value="Camber Sands"> - Camber Sands</option>
    <option value="Romney Sands"> - Romney Sands</option>
    <option value="Shurland Dale"> - Shurland Dale</option>
</select>

但我仍然需要两次点击(不是双击)来激活选择.如果我关闭Fastclick,单击会激活非原生选择,如预期的那样.

我用谷歌搜索了这个问题,但找不到任何东西.有人见过这个或有任何想法吗？

Answer 1

似乎当你将class ="needsclick"添加到非原生选​​择时,如下所示:

<select name="searchPriceto" id="searchPriceto" data-native-menu="false" class="needsclick">
<option value="">Price to</option>
...

然后,类'needsclick'出现在真实选择中(位于屏幕外,隐藏起来)和标签文本中仅用于假选择按钮:

<span class="needsclick">Price to</span>

如果您的大拇指碰巧恰好点击了文本,那么您的非原生菜单会根据需要首次出现.但是如果你错过了文本并点击了按钮范围,或者父主播或任何其他父元素,那么没有任何反应,直到你再次尝试(原因我并不完全清楚).

我通过在绑定Fastclick之前将'needsclick'添加到嵌套中的所有元素来修复此问题,如下所示:

        $("#searchPanel .ui-btn-inner").addClass("needsclick");
        $("#searchPanel .ui-btn-text").addClass("needsclick");
        $("#searchPanel a").addClass("needsclick");
        $("#searchPanel select").addClass("needsclick");

以及在原始选择标记标记中具有class ='needsclick',如上所示.

在我最初的问题中,我正在咆哮着正确的树,但是我错过了heirarchy中的一个元素(#searchPanel .ui-btn-text),这似乎阻止了修复工作.

我不禁感到有一种比这更好的方式,因为它感觉有点笨拙,但我想我会与有同样问题的人分享.

如果可以使用jquery选择器将Fastclick应用于仅识别的元素,那将是很好的:)