jquery - 单击一个 HTML 元素并触发 next() 可用的超链接？

Question

我想要一个元素来触发页面上的下一个可用元素。

$("span.topic").click(function(){
    $("span.topic").next("a.page").trigger('click');
});

<div> 
    <span class="topic">Topic 1</span>
    <a class="page" href="http://www.google.com">Welcome to the first Topic</a>
</div>

Answer 1

jsBin 演示

$('.topic').on('click', function(){
  window.location.href = $(this).next('a').attr('href');
});

Answer 2

如果您试图<span class='topic'>Topic 1</span>在点击时导航，您将无法通过触发锚标记的点击事件来做到这一点。浏览器将不会使用该方法进行导航。

但是，您可以将 更改window.location.href为 what httt://www.google.com。

尝试这个：

$("span.topic").click(function(){
    window.location.href = $("span.topic").next("a.page").attr('href');
});

这是您尝试的解决方案，但它不是引用您要导航到的 URL 的非常实用的方法。您是否有理由不像这样将 span 包裹在锚标签中？

<div> 
    <a class="page" href="http://www.google.com">
        <span class="topic">Topic 1</span>
        Welcome to the first Topic
    </a>
</div>

Answer 3

使用this所以它知道从哪个元素开始

$("span.topic").click(function(){
    $(this).next("a.page").click();
});

或者如果跨度和锚之间会有元素..

$("span.topic").click(function(){
    $(this).nextAll("a").first().click();
});

Answer 4

我不明白你为什么要使用这么多不必要的选择器。利用：

$("span.topic").click(function(){
    $(this).next().click();
});