Показать первую вкладку при загрузке страницы

Question

Я надеюсь, что кто-нибудь может помочь мне загрузить первую вкладку (сделать ее активной) при загрузке страницы. Теперь вкладки jquery работают нормально только после нажатия.

Я использую этот код:

HTML

<a class="link" href="#" rel="div1">Tab 1</a>
<a class="link" href="#" rel="div2">Tab 2</a>

<div class="content5" id="div1">Content of Tab 1</div>
<div class="content5" id="div2">Content of Tab 2</div>

Javascript / Jquery

$('.link').click(function(e) {
    e.preventDefault();
    var content = $(this).attr('rel');
    $('.active').removeClass('active');
    $(this).addClass('active');
    $('.content5').hide();
    $('#' + content).show();
});​

Есть идеи?

Answer 1

$(document).ready(function() {
    $('.link:first').addClass('active');
});

Answer 2

Я бы инкапсулировал логику дисплея;

function showTab(jqEl) {
    var content = jqEl.attr('rel');
    $('.active').removeClass('active');
    jqEl.addClass('active');
    $('.content5').hide();
    $('#' + content).show();
};

Вызов при необходимости;

$('.link').click(function(e) {
    e.preventDefault();
    showTab($(this));
});

и

$().ready(function() {
  showTab($(".link[rel=div1]")); //or better
});

Answer 3

Я не уверен, какой jquery вы используете, но попробуйте загрузить вкладку при загрузке страницы следующим образом:

 $(document).ready(function () {
            $("#tabs").tabs({ selected: 1 });
        });

Answer 4

Можете ли вы обернуть код в функцию?вызовите функцию изнутри события, передавая объект thr $ (this).Вызов функции при загрузке страницы, передающей ('.link'). First ()

Answer 5

Просто используйте HTML и CSS, чтобы сделать его видимым, например:

Tab 1 Tab 2

Содержимое Tab 1 Содержимое Tab 2

Итак, первая ссылка начинается с класса active, и первая вкладка начинается как видимая через display:block.

Answer 6

Вы можете вызвать клик по первой ссылке после привязки:

$('.link')
    .click(function(e) {
        ...
    })
    .first().click(); // or .trigger('click')

.click () / .trigger ('click')