How to use the toggle function in js-switching effect example

This article mainly introduces how the jQuery function toggle click event switching operates. First of all, everyone needs to understand the definition of the toggle() method. The toggle() method switches the visible state of an element. Hides the selected elements if they are visible, and shows them if the selected elements are hidden.

The following specific code examples:

toggle(fn,fn)

toggle() switches the function to be called every time it is clicked. If a matching element is clicked, the first function specified is triggered, and when the same element is clicked again, the second function specified is triggered. Each subsequent click repeats the call to these two functions in turn.

Note: You can use unbind("click") to delete.
Return value jQuery
Parameter fn (Function): The function to be executed when the odd-numbered click is made. fn (Function): The function to be executed when the even-numbered click is made.

jQuery code (a class for switching the table):

$("td").toggle( 
function () { 
$(this).addClass("selected"); 
}, 
function () { 
$(this).removeClass("selected"); 
} 
);
$('#btntrack').toggle(
 function(){
 $(this).text('继续跟踪');
 $(this).addClass('active');
 },
 function(){
 $(this).text('暂停跟踪')
 $(this).removeClass('active');
 }
)

It should be noted here: toggle is only useful when clicked, hover is just an event for the mouse to move in and out, and It doesn’t matter if you click. Both can be used together.

So this article is an introduction to toggle to achieve click switching. I hope everyone has a certain understanding of how to use the js toggle function.

The above is the detailed content of How to use the toggle function in js-switching effect example. For more information, please follow other related articles on the PHP Chinese website!