Question

我有一组带有哈希锚标签的jquery标签。

我想触发第二个标签＆＃39;＃second＆＃39;当我点击提交按钮。

我使用了一些解决方案，但没有工作。

<script type="text/javascript">
$('#bt').click(function() {
   $('#ex').click();
});
</script>

<div id="tabs">
<ul id="tabbbs">
<li><a href="#first" id="ex"></li>
<li><a href="#second" id="ex"></li>
<li><a href="#third"></li>
</ul>

 <div id="first" >
 <p>LOREM IPSUM</p>
 </div>
 <div id="second" >
 <p>LOREM IPSUM</p>
 </div>
<div id="third" >
 <p>LOREM IPSUM</p>
 </div>
</div>
<button type="submit" id="bt" class="single_add_to_cart_button button alt">
  <?php echo esc_html( $product->single_add_to_cart_text() ); ?>OK</button>

Answer 1

当您尝试使用jQuery处理它们时，多个相同的id不正确： -

BTW你可以这样做： -

$('#bt').click(function() {
   $('ul li a[href="#second"]').click();
});

注意： - 需要在脚本代码之前添加jQuery库才能使其正常工作。

只是一个演示示例（当您点击链接或按钮类时会添加）： -

＆＃13;

$('#bt').click(function() {
 $('ul li a[href="#second"]').click();
});

$('a[href="#second"]').click(function() {
 $(this).addClass('active');
});

＆＃13;

.active{
color:green;
font-size:20px;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="tabs">
<ul id="tabbbs">
<li><a href="#first" id="ex">Click1</a></li>
<li><a href="#second" id="ex">Click2</a></li>
<li><a href="#third">Click3</a></li>
</ul>

 <div id="first" >
 <p>LOREM IPSUM</p>
 </div>
 <div id="second" >
 <p>LOREM IPSUM</p>
 </div>
<div id="third" >
 <p>LOREM IPSUM</p>
 </div>
</div>
<button type="submit" id="bt" class="single_add_to_cart_button button alt">OK</button>

＆＃13;

Answer 2

您也可以尝试使用标签索引：

$('#bt').click(function() {
   $("#tabs").tabs({ active: 1 });
});

Answer 3

如果您想首先单击锚标记，则需要在锚标记上绑定单击事件，然后在按钮单击时触发单击事件。如下方法

$(function(){

$('#ex').click(function() {
   console.log('Hello clicked!');
});


$('#bt').click(function() {
   $('#ex').click();
});
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div id="tabs">
  <ul id="tabbbs">
  <li><a href="#first" id="ex">Hi</a></li>
  <li><a href="#second" id="ex">Hello</a></li>
  <li><a href="#third">By</a></li>
  </ul>

   <div id="first" >
   <p>LOREM IPSUM</p>
   </div>
   <div id="second" >
   <p>LOREM IPSUM</p>
   </div>
  <div id="third" >
   <p>LOREM IPSUM</p>
   </div>
</div>
<button type="submit" id="bt" class="single_add_to_cart_button button alt">OK</button>

按钮单击触发锚点选项卡

3 个答案: