0

我有一个拆分列表视图,如下所示(来自 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 列表视图。该示例(参见第一个列表项)使用 href 链接到另一个页面。这按预期工作。整个按钮是可点击的。

但我想要的是在单击右侧按钮时运行一个 javascript 函数。我已按如下方式附加了一个点击处理程序(请参阅第二个列表项):

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

现在,当我单击按钮的图标时,没有任何反应,单击按钮的其余部分可以正常工作。问题在于 JQM 为使其美观而添加的内容。我试图将点击处理程序放在 a 标签内的跨度上,但似乎没有任何效果。

那么,如何向右键添加点击处理程序?(里的第二个a)

4

1 回答 1

0

你可以试试:

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

或者

$('ul').on('click', '#secondListItem', function(e){
    e.preventDefault();
    console.log('clicked!!');
});
于 2012-07-18T16:16:12.587 回答