Jquery Mobile - 在新闻发布会上？答案

【问题标题】：Jquery Mobile - On press event?Jquery Mobile - 在新闻发布会上？
【发布时间】：2012-09-22 18:03:24
【问题描述】：

是否可以通过 jquery 对按钮按下手势进行操作？我们希望一个标签在用户按下它时改变颜色 - 所以基本上需要一个 on-press 或类似的东西？我以前在其他网站上看到过这个，但不知道怎么做。

感谢您的宝贵时间！

干杯保罗

【问题讨论】：

【解决方案1】：

可以绑定点击事件。

$('#id').bind('tap', function( event, data ){ //code };

在此处阅读更多信息：http://jquerymobile.com/demos/1.0rc1/docs/api/events.html

【讨论】：

【解决方案2】：

只需使用普通的 jQuery .click 事件。

【讨论】：

【解决方案3】：

相关：

Specifying the styles for the selected tab in a navbar

现场示例：

http://jsfiddle.net/phillpafford/8pwFK/29/

JS：

$('#custom-li-1').click(function() {
    $(this).attr('data-icon','star');
    $(this).children().children().next().removeClass('ui-icon-custom').addClass('ui-icon-star');
}).page();

$('#custom-li-2').click(function() {
    $(this).attr('data-icon','home');
    $(this).children().children().next().removeClass('ui-icon-grid').addClass('ui-icon-home');
}).page();

$('#custom-li-3').click(function() {
    $(this).attr('data-icon','grid');
    $(this).children().children().next().removeClass('ui-icon-star').addClass('ui-icon-grid');
}).page();

HTML：

<div data-role="page" id="home">
    <div data-role="header" data-theme="b">
        <h1>Test</h1>
    </div>
    <div data-role="content" data-theme="d">
        <div data-role="navbar" data-theme="d">
            <ul id="custom-nav-list">
                <li><a href="#" data-icon="custom" class="ui-btn-active" id="custom-li-1">Home</a></li>
                <li><a href="#" data-icon="grid" id="custom-li-2">Second page</a></li>
                <li><a href="#" data-icon="star" id="custom-li-3">Third page</a></li>
            </ul>
        </div>
    </div>

</div>

【讨论】：

【解决方案4】：

当用户触摸 div2 上的某个位置时，我想隐藏 div1。

仅仅使用点击或点击并没有达到目的..所以最终使用以下

要捕获各种触摸事件，请使用

$('#div2').bind('tap click swipe focus', function() {
   $('#div1').hide();
});

【讨论】：