jQuery的toggle()方法應該是在滑鼠點擊後才會觸發,現在的問題是在ready載入後就自動觸發了,怎麼回事呢? 答案是jQuery的版本問題,在1.9以後的版本toggle()就存在這個問題,用之前的版本就正常了。 如果你非常喜歡這個功能,有2個辦法,一個辦法是jquery官網提供的一個版 ...
jQuery的toggle()方法應該是在滑鼠點擊後才會觸發,現在的問題是在ready載入後就自動觸發了,怎麼回事呢?
答案是jQuery的版本問題,在1.9以後的版本toggle()就存在這個問題,用之前的版本就正常了。
如果你非常喜歡這個功能,有2個辦法,一個辦法是jquery官網提供的一個版本升級文件。http://blog.jquery.com/2013/05/08/jquery-migrate-1-2-1-released/
另外一個辦法是笨辦法,就是把原來的那塊代碼拿出來,寫成一個插件。
<!doctype html> <html> <head> <meta charset="UTF-8"> <title>test</title> <script type="text/javascript" src="http://cdn.staticfile.org/jquery/1.11.1/jquery.js"></script> </head> <body> <button>test click me</button> <script> $(document).ready(function(){ $("button").toggle(function(){ $("body").css("background-color", "green"); }, function(){ $("body").css("background-color", "red"); }, function(){ $("body").css("background-color", "yellow"); }); }); $.fn.toggle = function( fn ) { // Save reference to arguments for access in closure var args = arguments, guid = fn.guid || jQuery.guid++, i = 0, toggler = function( event ) { // Figure out which function to execute var lastToggle = ( jQuery._data( this, "lastToggle" + fn.guid ) || 0 ) % i; jQuery._data( this, "lastToggle" + fn.guid, lastToggle + 1 ); // Make sure that clicks stop event.preventDefault(); // and execute the function return args[ lastToggle ].apply( this, arguments ) || false; }; // link all the functions, so any of them can unbind this click handler toggler.guid = guid; while ( i < args.length ) { args[ i++ ].guid = guid; } return this.click( toggler ); } </script> </body> </html>