Question

我有一个像下面那样的分组列表视图（来自JQM示例）：

<ul data-role="listview" data-split-icon="gear" data-split-theme="d">
        <li><a href="index.html">
                <img src="images/album-bb.jpg" />
                <h3>Broken Bells</h3>
                <p>Broken Bells</p>
            </a>
            <a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
            </a>
        </li>
        <li>
            <a id="secondListItem">
                <img src="images/album-hc.jpg" />
                <h3>Warning</h3>
                <p>Hot Chip</p>     
            </a>
            <a href="lists-split-purchase.html" data-rel="dialog" data-transition="slideup">Purchase album
            </a>
        </li>           
    </ul>

这导致een listview在所有项目的右侧显示齿轮按钮。该示例（请参阅第一个listitem）使用href链接到另一个页面。这按预期工作。整个按钮是可点击的。

但我想要的是在点击右侧按钮时运行javascript函数。我附加了一个clickhandler，如下所示（参见第二个列表项）：

$('#secondListItem').click(function(){
    console.log('clicked!!');
});

现在当我点击按钮的图标时没有任何反应，单击按钮的其余部分工作正常。问题在于JQM的补充，使它变得漂亮。我试图将clickhandler放在标签内的跨度上，但似乎没有任何效果。

那么，如何在右键添加点击处理程序？（李中的第二个）

Answer 1

您可以尝试：

$('#secondListItem').click(function(e){
    e.preventDefault();      // to prevent default browser load activity
    console.log('clicked!!');
});

OR

$('ul').on('click', '#secondListItem', function(e){
    e.preventDefault();
    console.log('clicked!!');
});

拆分列表视图中的链接不可点击

1 个答案: