Disable jQuery.toggle () method

Question

I am looking for a way to disable .toggle() attached to a div

 if (condition) { $("#div").toggle( function() { do this }, function() { do that } ); } else { // How do I achieve this? $("#div").disableToggle( ); } 

More explanation:

This is a map application. toggle associated with the image button. The map is loaded at zoom level 4. The user zooms in and the corresponding button only becomes active when the user has increased by more than zoom level 6. As soon as the user zooms in to level 6, I want the toggle button to become inactive again.

Answer 1

Why not just cancel the click?

 $('#div').unbind('click'); 

Answer 2

You can put condition inside the function:

 $("#div").toggle( function() { if (condition) { //do this } }, function() { if (condition) { //do that } } ); 

Answer 3

You can use .cleanData() :

 // this will destroy all data bound to that element $.cleanData($("#div")); 

Demo

Answer 4

Here is the way:

Delete the class that is selected to switch. Fiddle here: http://jsfiddle.net/leifparker/rSP34/2/

HTML

 <div class="button_toToggle"> Toggle it! </div> <div class="button_disableToggle"> Disable Toggle </div> <div class="happyDiv togglable">&nbsp;</div> 

Js

 $('.button_toToggle').click(function(){ $('.togglable').toggle(); }); $('.button_disableToggle').click(function(){ $('.happyDiv').removeClass('togglable'); }); 

Answer 5

If you did not pass an anonymous toggle() function, you could use the technique described in this forum post to trigger events.