0

我有一个正在构建的菜单，看起来像这样：

<ul id="myUl">
    <li><span>li #1</span>
        <ul>
            <li>
                <div class="myContent">
                    <a href="" name="myLink">clickMe!</a>
                </div>
            </li>
    </li>
</ul>

所以，我想为id 的<a>标签定义一个点击处理程序ul"myUl".

我尝试了类似css选择器的东西：

$('ul[id="myUl] a').on('click', do stuff!);

或者

$('ul[id="myUl] > a').on('click', do stuff!);//这不起作用，因为a它不是ul.

a处理这个特定元素的点击的正确方法是ul什么？

4

7 回答 7

4

像这样。

$('#myUl a').on('click', your_func);

请注意，我没有使用>，这将您限制为ul.

或者你可以这样做。

$('#myUl').on('click', 'a', your_func);

不同之处在于 this 将处理程序绑定到 UL，但仅在a单击时触发它。第一个示例直接绑定到a.

于 2012-09-28T14:28:27.200 回答
2

很简单：

$('#myUl').on('click', 'a', do stuff!);
于 2012-09-28T14:29:38.963 回答
1

您还可以在选择器中指定上下文

$('a','#myUl').click
//  This is equivelant to $('#myUl').find('a')
//  So this finds all descendant anchor tags of #myUl
于 2012-09-28T14:39:59.520 回答
1

在选择器中使用>会使它比它需要的更具体。如果您将其取出，那么它将适用于任何子元素（在任何级别），而不是直接子元素。

$(document).ready(function() {
    $('ul#myUl a').click(function() {
        // do stuff
    });
});
于 2012-09-28T14:28:34.970 回答
1 
$('ul#myUl a').on('click', do stuff!);

或者

$('ul[id="myUl"] a').on('click', do stuff!);

应该管用。

于 2012-09-28T14:29:05.130 回答
1

您缺少 " in$('ul[id="myUl"] a').on('click', do stuff!);和 in$('ul[id="myUl"] > a').on('click', do stuff!); 但您可以直接使用元素的 id 作为选择器：

$('#myUl a').on('click', handler function);

于 2012-09-28T14:29:13.630 回答
1

你错过了一个报价，但试试这个：

$('#myUl a').on('click', function(){alert('do stuff!')});
于 2012-09-28T14:29:19.690 回答