如何通過事件增加/減少對象的屬性值？

Question

我正在嘗試將手風琴小部件用於jQuery-ui。 我正在嘗試構建的功能是通過滑動在所有選項卡之間循環。 對於此示例，我使用了click事件，因為我具有向上/向下滑動事件監聽器，它們分別工作並且與我的問題無關。 本質上，用戶將滑動或單擊一個區域，而選項卡將使這三個部分來回循環。

我是在正確的軌道上嗎，還是有更好的方法來做到這一點？

jsFiddle演示

JS

$(function () {
    $("#accordion").accordion({
        collapsible: true,
        active: false
    });
});


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

    $('#accordion').accordion({
        active: 0
    });

    function incrementAccValue(obj, val) {
        obj = $('#accordion').accordion({
            active: val
        });

        obj.active++ //stuck here..?

    }

});

//How to increment an object's property value?

Answer 1

您走在正確的軌道上。 您只需要將有效數字存儲在click函數范圍之外，以便該值將在下一次click事件中可用。

這樣的事情應該起作用： http : //jsfiddle.net/30vm5y75/

var max_items = $('#accordion h3').length;
var current_item = 0;

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

    $('#accordion').accordion({
        active: current_item
    });

    if (current_item < max_items-1) {
        current_item = current_item + 1;
    } else {
         current_item = 0;   
    }

});

Answer 2

不知道這是否是您所需要的，但是我在這里更新了您的小提琴。

更新的JS：

var activeIndex = 0,
    maxIndex = $("#accordion h3").length - 1;

$(function () {
    $("#accordion").accordion({
        collapsible: true,
        active: false
    });
});

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

    $('#accordion').accordion({
        active: activeIndex
    });

    activeIndex = ( activeIndex == maxIndex ? 0 : activeIndex+1);

});   

Answer 3

從文檔中：

// Getter
var active = $( ".selector" ).accordion("option", "active" );

// Setter
$( ".selector" ).accordion( "option", "active", 2);

因此，您不必將當前索引存儲在任何地方。 只需獲取活動索引，然后將活動索引設置為active + 1或手風琴的長度減去一（以較小者為准）即可。