如何使用 jQuery 在元素單擊的兩個函數之間切換？

jQuery 點擊在兩個函數之間切換

需要根據元素被單擊一次還是多次來執行不同的操作？以下是如何使用jQuery 實現它：

內建.toggle() 方法

jQuery 提供了兩種.toggle() 方法：

• 一個方法可以切換元素的可見性。
• 一個名為toggle(func1, func2)的已棄用的方法（在jQuery 1.9中刪除）可以有效地處理元素單擊時兩個函數之間的切換。

自訂外掛實作

作為插件，此功能可以如下實現：

(function($) {
    $.fn.clickToggle = function(func1, func2) {
        var funcs = [func1, func2];
        this.data('toggleclicked', 0);
        this.click(function() {
            var data = $(this).data();
            var tc = data.toggleclicked;
            $.proxy(funcs[tc], this)();
            data.toggleclicked = (tc + 1) % 2;
        });
        return this;
    };
}(jQuery));

用法

使用該插件，您可以呼叫：

$('#test').clickToggle(function() {   
    $(this).animate({
        width: "260px"
    }, 1500);
},
function() {
    $(this).animate({
        width: "30px"
    }, 1500);
});

具體範例

根據原來的問題，您可以實現所需的功能：如下：

var count = 0;
$("#time").clickToggle(
    function() {
        $(this).animate({
            width: "260px"
        }, 1500);
    },
    function() {
        $(this).animate({
            width: "30px"
        }, 1500);
    }
);

以上是如何使用 jQuery 在元素單擊的兩個函數之間切換？的詳細內容。更多資訊請關注PHP中文網其他相關文章！