Question

这是我尝试过的JS：

$('#footer').find('.browse li').click(function(e){
            $(this).find('a').click();
        });

以下是有问题的HTML：

<div id="footer" class="span-24"><div class="footer-box"><div class="footer-holder">
    <div class="browse">
        <ul>
           <li><a href="xyz">123</a></li>
           <li><a href="xyz">123</a></li>
           <li><a href="xyz">123</a></li>
           <li><a href="xyz">123</a></li>
        </ul>
    </div>
</div></div></div>

如果点击<a>，如何点击<li>？

PS。这是由于css设计（LI有一堆填充和背景无法放在A上）

Answer 1

您对.click()的来电只会触发与a click事件绑定的任何内容。我想你想要的是这样的：

$('#footer').find('.browse li').click(function(){
   window.location = $(this).find('a').attr('href');
}

Answer 2

您是否只是错过了a的点击事件？例如：

$('.browse li').click(function(e){
            $(this).find('a').click();
        });

$('a').click(function(){
   alert("a clicked");
    return false;
});

看到这个小提琴：http://jsfiddle.net/LRMqD/3/

另一方面，如果您只是想重定向到href，请尝试以下代码：

$('.browse li').click(function(e){
            window.location.href = $(this).find('a').attr('href');
        });

Answer 3

请不要将事件处理程序附加到每个元素。

改为使用delegate：

$('#footer').find('.browse li').delegate('a', 'click', function(e){
    var elt = e.target;
    console.log('clicked a number '+elt.id);
});

Answer 4

要点击<a>，您需要执行trigger。

http://api.jquery.com/trigger/

$('#footer').find('.browse li').click(function(e){
    $(this).find('a').trigger('click');
});

如何点击自包含的<a> of an <li>?</li></a>

4 个答案: