如何在jquery选项卡当前活动的选项卡上触发（'点击'） [英] How to trigger('click') on jquery tab's currently active tab

问题描述

我有一个标签屏幕，并希望在提交表单并返回有效后触发所选标签上的点击。这里是html的一部分：

I have a tabed screen and want to trigger a click on the selected tab once the form is submitted and the return is valid. Here a part of the 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>

我的成功命令是：

success: function(data, textStatus, XMLHttpRequest) {
    $('#tabUL').find('li.current a').trigger('click');
}

这似乎不工作...任何帮助是赞赏:)对于Andrea

This seems not working... Any help is appreciated :) Regards Andrea

推荐答案

尝试使用 a [href =] selector： / p>

Try using the a[href=""] selector:

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

我把一个 jsfiddle演示，以显示它的行动，以及如何可选地隐藏其他选项卡，因为我通常在编程时强制选项卡要求缺少必需的信息在初始

I put together a jsfiddle demo to show it in action, and how to optionally hide the other tabs since often when I'm programmatically forcing tabs its to require missing mandatory information be entered on the initial tab before unlocking the other tabs...

编辑
这是jsfiddle的内容：

Edit Here is the contents of the jsfiddle:

HTML

<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

jQuery

$(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});
    }
  });
});

这篇关于如何在jquery选项卡当前活动的选项卡上触发（'点击'）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！