Нажмите на ссылку и вызвать другую

Question

Ok поэтому у меня есть этот HTML код:

<h1 class="left" data-target="newest">Newest</h1> 
............ 
<h1 class="left" data-target="topRated">Top Rated</h1> 
.... 

который щелкать на теге h1 делает функцию JQuery, теперь я это HTML связывает

 <li> 
      <a href="">Newest</a> 
     </li> 
     <li> 
      <a href="">Top Rated</a> 
     </li> 

мне нужно сделать так или иначе, что при нажатии <a href="">Newest</a> в списке или <a href="">Top Rated</a>, будьте как если бы вы нажимали на тег h1. Это возможно?

спасибо.

Answer 1

Основываясь на ваш комментарий, вы хотите, чтобы иметь возможность нажать на h1, и на самом деле щелкнуть связанный якорь.

$("h1").click(function(){ 
    var textTarget = $(this).text(); 
    $("a").filter(function(i, val) { return $(val).text === textTarget; }).click(); 
}); 

В идеале, хотя, если вы могли бы сделать:

<li> 
    <a href="" data-target="newest">Newest</a> 
</li> 
<li> 
    <a href="" data-target="toprated">Top Rated</a> 
</li> 

тогда скрипт будет просто:

$("a").click(function(){ 
    $("h1[data-target='" + $(this).data("target") + "'").click(); 
}); 

Answer 2

Измените ссылки на:

<a href="#" class="h1-selector" data-action="newest">Newest</a> 

Тогда вам просто необходимо, чтобы вызвать щелчок на H1:

$('a.h1-selector').click(function(){ 
    $('h1[data-target="'+$(this).data('action')+'"]').click(); 
}); 

Answer 3

$('a').click(function(){ 
    var href = $(this).text();//Newest 
    $('h1[data-target=' + href + ']').trigger('click'); 
});