javascript - JQM 标题按钮难以点击

Question

我的 JQM 标题上有多个小的无文本按钮，请参阅下图，在我的 Android PhoneGap 应用程序上。这些按钮在触摸屏设备上很难单击(在桌面浏览器上则很好)。似乎要触发点击事件，我必须点击按钮的顶部 10-20%，点击按钮的中间或底部不会执行任何操作。

以下是 HTML 中的代码:

<div data-role="header" data-position="fixed">
  <h1>Field Trip GB</h1>
  <div class="ui-header-buttons ui-btn-right" data-type="horizontal" >
    <a class="gpstrack-running"
       data-role="button"
       data-inline="true"
       data-transition="none"
       data-iconpos="notext"
       data-shadow="false"
       data-iconshadow="false"
       style="display: none;">
    </a>
    <a class="user-locate"
       data-role="button"
       data-inline="true"
       data-transition="none"
       data-iconpos="notext">
    </a>
    <a class="map-search"
       data-role="button"
       data-inline="true"
       data-transition="none"
       data-iconpos="notext">
    </a>
  </div>
</div>

我正在用 javascript 监听:

$('.map-search').live('click', function(){
    console.log('map search');
});

Answer 1

使用tap或vclick进行绑定(bind)。 IE。 .on('tap',function(){...})。

.live() 自 jquery 1.7 起已弃用。

来源:jQM event docs