Question

我使用cordova和jQuery mobile作为UI框架创建了一个移动应用程序。它工作正常，只是单击角落时jQuery移动按钮上的click事件不会触发。单击角落时我看到悬停效果（按钮颜色更改），但未触发单击事件。从按钮角点击一下内部时会触发Click事件。

我正在使用jQuery mobile 1.4.2。下面是我的按钮（具有类showOptions和ui-btn的锚标记）标记和单击处理程序：

<div data-role="header" data-theme="b" data-position="fixed" data-tap-toggle="false">
    <img src="images/logo_small.png" class="appLogoImg dontDisplay ui-btn-left" style="margin-top: 6px;" />
    <h1 class="ui-title">All Packages</h1>
    <div class="ui-controlgroup ui-controlgroup-horizontal ui-btn-right">
        <a href="#" class="showOptions ui-btn ui-icon-bars ui-btn-icon-left ui-nodisc-icon">Options</a>
    </div>
</div>


$('.showOptions').on('click', function() {
    console.log('button clicked');
    return false;
});

那里有人也面临同样的问题吗？请帮帮我。

Answer 1

不要使用<button>或<input type="submit">，最好使用<a>（与您一样）data-role="button"属性。

<a href="#" data-role="button" class="showOptions ui-btn ui-icon-bars ui-btn-icon-left ui-nodisc-icon">Options</a>

data-role=button的锚点不会被.ui-btn div包裹。因此，您将拥有响应任何事件的整个按钮。

Jquery移动按钮点击角落不起作用

1 个答案: