Question

所以，我有这个<ol>在jQuery（1.4.2）的帮助下附加了一些事件。所有操作都在$(document).ready() - 电话中完成。

奇怪的是点击<li>确实会产生点击<a>的点击（我可以通过取消注释console.log() - 部分来看到这一点）但它不会导航UA。为什么是这样？ event.stopPropagation()在内部调用event.preventDefault()还是什么？

我知道我可以在window.location.href = $('h3 a', this).eq(0).attr('href');的点击事件中<li>，但我真的想知道为什么它不能使用点击通话。

先谢谢SOers！

代码：

HTML：

<ol class="news">
    <li>
        <img src="http://dummyimage.com/325x325/000/fff.jpg">
        <span class="date">12th of May</span>
        <h3><a href="http://example.com/lorem-ipsum">Lorem Ipsum</a></h3>
        <p>Nullam rhoncus, massa nec posuere rutrum, mauris metus ornare lacus, facilisis. Rhoncus purus dui vel lectus.</p>
    </li>
    <li>
        <span class="date">3rd of May</span>
        <h3><a href="http://example.com/lam-sum-idum">Lam sum idum</a></h3>
        <p>Mauris volutpat enim nec turpis pharetra consectetur. Cras faucibus mattis dignissim.</p>
    </li>
    <!-- many more LIs here... -->
</ol>

（是的。已经验证了HTML 4.01。）

JavaScript的：

$('.news li').click(function () {
    $('h3 a', this).eq(0).click();
}).hover(function () {
    $(this).toggleClass('hover');
}).find('h3 a').click(function (e) {
    e.stopPropagation();// prevent recursion
    //console.log(this);
});

Answer 1

这是正常的，在锚上手动触发click 不跟随链接，在模拟动作时通常不会触发“默认事件”。设置location.href是这里的方法，如下所示：

$('.news li').click(function () {
    window.location.href = $(this).find('h3 a').attr('href');
}).hover(function () {
    $(this).toggleClass('hover');
}).find('h3 a').click(function (e) {
    e.stopPropagation(); //so ctrl+click works on the link, etc
});

顺便说一句，.eq(0)，.attr('href')不需要从匹配集中的第一个元素获取href。

Click事件不会触发默认操作

1 个答案: