iT邦幫忙

4

jQuery移除jQuery.fn.toggle(fn1,fn2)之後的替代方案

過去自己常用jQuery.fn.toggle(fn1,fn2)來處理click事件的兩種狀態,例如click一次做一個動作,再click一次則回復原來的動作,只要把兩個動作處理的function handler指定給toggle當前、後兩個參數即可。

但是由於jQuery中,有兩個名稱一樣,但作用不同的toggle,一個就是前面描述的,另一個則是用來顯示/隱藏元素。在jQuery 1.8中,前面描述的功能已經列入不建議使用,而1.9更是移除掉,只保留用來顯示/隱藏元素的機制。

因此只要使用jQuery 1.9,有用上toggle(fn1,fn2)的都會失效。除非用上 jQuery Migrate plugin或者官方建議從原始碼找出原來的作法,抽出來獨立使用。

其實原本提供的toggle(fn1,fn2)直觀又好用,移除實在太可惜了,剛好在stackoverflow看到一段替代辦法,轉過來分享給大家。

$.fn.toggleClick = function(){

    var functions = arguments ;

    return this.click(function(){
            var iteration = $(this).data('iteration') || 0;
            functions[iteration].apply(this, arguments);
            iteration = (iteration + 1) % functions.length ;
            $(this).data('iteration', iteration);
    });
};

上面的程式碼已經整理成jQuery plugin, 所以只要依一般jQuery的外掛使用方法即可。

程式碼的出處在此:http://stackoverflow.com/questions/14338078/equivalent-of-deprecated-jquery-toggle-event


尚未有邦友留言

立即登入留言