Фокус на новой вкладке

Question

Мне нужна ваша помощь для следующего подхода.

Мое требование

1) Загрузка страницы с двумя вкладками, а именно ПОИСК и ДЕТАЛИ. 2) По умолчанию вкладка DETAILS не должна быть включена. 3) На странице поиска, при извлечении набора результатов, при нажатии набора результатов данные должны быть заполнены на вкладке DETAILS. Вторая вкладка должна быть включена onclick, и фокус также должен перейти на вкладку DETAILS. 4) Навигация между обеими вкладками должен быть плавным.

В настоящее время я работаю над Struts 1.3.

Можете ли вы мне помочь?

Answer 1

создать вкладку с active: 0 (предполагая, что индекс search вкладки является 0, что он является первой вкладкой) на событии нажатия на закладку заголовка details создать закладку снова active: 0 на проверках поиска unbindclick события из details tab и вызвать click на a тег внутри заголовка li из details вкладки раз details tab открывается снова связать это событие нажмите чтобы создать tabs с active: 0

<div id="tabs"> 
<ul> 
    <li><a href="#tabs-1">Search</a></li> 
    <li id="deactive"><a href="#tabs-2">Details</a></li> //add id deactive 
</ul> 
<div id="tabs-1"> 
    <input id="search" type="text" /> 
    <button>Search</button> 
</div> 

<div id="tabs-2"></div> 
</div> 

сценарий

$("#tabs").tabs({ 
    active: 0 
}); 

$('#deactive').click(function() { 

    $('#tabs').tabs({ 

     active: 0 //refer to api documentation of jquery ui-tabs 
    }) 
}) 

$('button').click(function() { 
    var value = $('#search').val().toLowerCase() 

    if (value == " your comparison/validation criteria ") { 

     $('#deactive').unbind('click') 
     $('#deactive >a').trigger('click') 

     $('#deactive').click(function() { 

      $('#tabs').tabs({ 
       active: 0 //refer to api documentation of jquery ui-tabs 
      }) 
     }) 
    } 
}) 

CLICK HERE FOR DEMO

DEMO FOR POPULATING DETAILS TAB ON THE BASIS OF SEARCH

ПРИМЕЧАНИЕ, что это будет держать DETAILS TAB отключил все время, если вы не хотите этого поведения, вы должны адаптировать код в соответствии с вашими требование