Javascript 如何在jquery选项卡上触发(';单击';);s当前处于活动状态的选项卡

Javascript 如何在jquery选项卡上触发(';单击';);s当前处于活动状态的选项卡,javascript,jquery,events,jquery-ui-tabs,eventtrigger,Javascript,Jquery,Events,Jquery Ui Tabs,Eventtrigger,我有一个选项卡式屏幕,希望在表单提交且返回有效后触发对所选选项卡的单击。这里是html的一部分: <ul id="tabUL" class="tabs js-tabs same-height"> <li class="current"> <a class="tabLink" href="#tabProducts" data-url="/bla/bla">Products</a> </li> </ul

我有一个选项卡式屏幕,希望在表单提交且返回有效后触发对所选选项卡的单击。这里是html的一部分:

<ul id="tabUL" class="tabs js-tabs same-height">
    <li class="current">
        <a class="tabLink" href="#tabProducts" data-url="/bla/bla">Products</a>
    </li>
</ul>

这似乎不起作用。。。感谢您的帮助:)如果您想以编程方式重新加载选项卡,建议使用Jquery选项卡API实用程序,如下所示: 这会使第一个选项卡处于活动状态,然后激活第二个选项卡,非常简单,并且还会引发通常在直接单击时引发的事件

$( "#myTabs" ).tabs( "option", "active", 0 );

$( "#myTabss" ).tabs( "option", "active", 1 );
您还可以捕获活动事件选项卡,如下面所示,以执行任何操作

$( "#myTabs" ).on( "tabsactivate", function( event, ui ) {
    // your custom code on tab click
});

与其尝试触发单击事件本身(我认为在这种情况下不可能通过编程方式调用用户事件),我建议您触发必须在单击事件上调用的函数,您可能需要查看尝试使用
a[href=”“]
选择器:

$('#tabUL a[href="#tabProducts"]').trigger('click');

我把一个标签放在一起,以显示它的作用,以及如何选择性地隐藏其他标签,因为我经常以编程方式强制其标签要求在解锁其他标签之前在初始标签上输入缺少的强制信息

编辑 以下是JSFIDLE的内容:

HTML


如果该选项卡已被选中,您希望单击它做什么?请尝试$('li.current').parent().trigger('click');您的js控制台是否报告任何错误?您的成功功能是否被击中?您是否尝试过在点击触发器上方发出警报?是的,成功功能被点击。我试过使用$('tabUL').find('li.current a').css('background-color','red');整个李被涂成了红色。没有错误被报告…我没有更好的建议
$('#tabUL a[href="#tabProducts"]').trigger('click');
<div id="tabs">
  <ul>
    <li><a href="#tab0">Address</a></li>
    <li><a href="#tab1">Shipping</a></li>
    <li><a href="#tab2">Parts</a></li>
    <li><a href="#tab3">Datasheets</a></li>
  </ul>
  <div id="tab0">
        <h1>This is the first tab (0)</h1>
  </div>
  <div id="tab1">
     <h1>This is the second tab (1)</h1>
  </div>
  <div id="tab2">
     <h1>This is the third tab (2)</h1>
  </div>
  <div id="tab3">
     <h1>This is the fourth tab (3)</h1>
  </div>
</div>
<br/>
Select the
<select id="tabSelect">
  <option value="0">1st</option>
  <option value="1">2nd</option>
  <option value="2">3rd</option>
  <option value="3">4th</option>
</select>Tab and
<input type="checkbox" id="tabHide" checked="checked" /> Lock the Others
$(document).ready(function () {
  $('#tabs').tabs();
  $('#tabSelect').change(function () {
        //pass empty array to unlock any locked tabs
    $('#tabs').tabs({disabled: []}).find('a[href="#tab' + $(this).val() + '"]').trigger('click');

    if ($('#tabHide').prop('checked')) {
      //hide will be an array like [0,2,3]
      var hide = Array();
      $('#tabs li').not('.ui-tabs-active').each(function () {
        hide.push($(this).index());
      });      
      $('#tabs').tabs({disabled: hide});
    }
  });
});