0

我有个问题。我想从某个列表中获取 id。这是列表：

<ul id="ul_navigation">
        <li><a href="<?php echo full_url(); ?>">Home</a></li>
        <li id="1"><a href="#">Office Routine</a>
            <ul>
                <li id="4"><a href="#">Meeting Points</a></li>
                <li id="5"><a href="#">Statistic 101</a></li>
                <li id="6"><a href="#">Email 101</a></li>
                <li id="7"><a href="#">General</a></li>
                <li id="8"><a href="#">Schedule</a></li>
                <li id="9"><a href="#">Smart Tips</a></li>
            </ul>
        </li>
        <li id="2"><a href="#">Procedures</a>
            <ul>
                <li id="10"><a href="#">Operation</a></li>
                <li id="11"><a href="#">Export Commercial</a></li>
                <li id="12"><a href="#">Customer Service</a></li>
                <li id="13"><a href="#">Export Document</a></li>
                <li id="14"><a href="#">Logistic</a></li>
                <li id="15"><a href="#">Finance</a></li>
                <li id="16"><a href="#">Import Document</a></li>
                <li id="17"><a href="#">Information Technology</a></li>
                <li id="18"><a href="#">Human Resource Management</a></li>
            </ul>

我可以使用下面的 jquery 语法获取 id：

$("#ul_navigation li").click(function() {
        alert(this.id); // get id of clicked li
    });

它工作得很好，但问题是，当我点击 sublist id 时，标题列表 id 也会显示出来。例如，我单击 id 为 4 的会面点，然后也会显示办公室常规 id。

如何创建一些排除，以便只显示子列表 ID？

谢谢你。

4

3 回答 3

2

Arun P johny 的回答很好，但我会补充一些东西。

我建议您将 click 事件绑定到a而不是li. 这样，它将解决您的问题，并且您可以.preventDefault() 在需要时使用。

例如，如果Office Routine有一个子菜单并在单击时打开它（不加载另一个页面），代码将如下所示：

$('li ul').hide()
$("#ul_navigation li a").click(function(e) {
    var $this = $(this);
    alert($this.parent().attr('id')); // get id of clicked li
    if($this.closest('ul').is('#ul_navigation') && $this.siblings('ul').length){
        e.preventDefault();
        $this.siblings('ul').toggle()
    }
});

小提琴：http: //jsfiddle.net/aq8QC/2/

当然，如果不需要，我会一直使用e.stopPropagation()

于 2013-06-19T03:38:08.007 回答
1

一旦事件被处理，您需要阻止事件传播。

$("#ul_navigation li").click(function(e) {
    alert(this.id); // get id of clicked li
    e.stopPropagation()
});

演示：小提琴

于 2013-06-19T03:11:05.577 回答
0

使用直接子选择器：

$("#ul_navigation > li").click(function() {
        alert(this.id); // get id of clicked li
    });

这是演示 这是文档

于 2013-06-19T03:13:32.257 回答