Как я могу определить, отображается ли вкладка jquery из-за щелчка пользователя или поворота вкладки

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

Я подключил все стандартные события, показ и выбор, и они срабатывают независимо от источника изменения вкладки.

У кого-нибудь есть идеи? В основном я хотел бы сделать что-то дополнительное, если пользователь щелкнул вкладку, но не в том случае, если вкладка изменится сама по себе посредством поворота.

Если я подключаю щелчок даже к самим вкладкам, похоже, он вообще не срабатывает, я предполагаю, что виджет вкладок использует само это событие.

Изменить: вот основной код

<script type="text/javascript">
$(document).ready(function(){
    $("#featured").tabs(
        {show: function(e, ui) { console.log(e);} }
    ).tabs("rotate", 5000, false);
});
</script>

Консоль покажет событие (e), независимо от того, щелкнуло ли оно пользователем или показано как часть поворота. Кроме того, то же самое, если я изменю событие с show: на select:


jquery jquery-ui jquery-ui-tabs
person Richard Edwards    schedule 28.04.2010    source источник

Ответы (2)


arrow_upward
1
arrow_downward

Из документации jQueryUI:

Это событие срабатывает при нажатии на вкладку.

$( ".selector" ).tabs({
   select: function(event, ui) { ... }
});
person Z. Zlatev    schedule 28.04.2010
comment
select: срабатывает, если пользователь нажимает на вкладку или если это делается как часть поворота и, следовательно, недостаточно для определения источника - person Richard Edwards; 29.04.2010
comment
что такое event.type, когда он запускается вращением? - person Z. Zlatev; 29.04.2010
comment
event.type — это tabsselect, когда он запускается вращением, и то же самое для щелчка пользователя, и это tabsshow для обоих источников для события show:. Я надеялся использовать его, но, похоже, нет никакой разницы. - person Richard Edwards; 29.04.2010

arrow_upward
1
arrow_downward

Если вы разработаете свою собственную логику вращения вместо использования встроенного метода rotate, то вы можете установить флаг, который вы сможете проверить позже. Что-то вроде этого должно работать:

var isRotating = false,
    rotationInterval = 5 * 1000, // 5 seconds
    rotationTimerId;

function rotate() {

    var tabsElement = $('#my-tabs'),
        currentIndex = tabsElement.tabs('options', 'selected'),
        maxIndex = tabsElement.tabs('length') - 1,
        nextIndex = currentIndex === maxIndex ? 0 : (currentIndex + 1);

    isRotating = true;
    tabsElement.tabs('select', nextIndex);
    isRotating = false;

}
function startRotation() {

    if (!rotationTimerId) {
        rotationTimerId = window.setInterval(rotate, rotationInterval);
    }

}
function stopRotation() {

    if (rotationTimerId) {
        window.clearInterval(rotationTimerId);
        rotationTimerId = null;
    }

}

$('#my-tabs').tabs({
    select: function() {
        alert(isRotating ? 'this is from the rotation' : 'this is from a user click');
    }
});
startRotation();
person Ken Browning    schedule 28.04.2010