Advanced Search

Return to Snippet

Revision: 14919
at June 17, 2009 10:03 by localhorst
Initial Code 
//check first status with jQuery
//not needed if class initially are set

jQuery("#file_aktiv").click(function() {
  if(jQuery(this).is(":checked") === true) 
    jQuery('label[for=file_aktiv]').addClass('file_active');
  else 
    jQuery('label[for=file_aktiv]').addClass('file_active');
});

//then
jQuery("#file_aktiv").click(function() {
  jQuery('label[for=file_aktiv]').switchClass('file_active','file_inactive');
});

//the switchClass function
(function($){var class1,class2,overrideClass=null;$.fn.switchClass=function(){if(arguments.length<2){alert("Illegal usage. switchClass requires at least 2 parameters, containing the class names to toggle.");return this;}
class1=arguments[0];class2=arguments[1];overrideClass=null;if(arguments.length==3)
overrideClass=arguments[2];return this.each(function(){$.fn.switchClass.process($(this));});};$.fn.switchClass.process=function(el)
{if(overrideClass!=null)
{if(overrideClass==class1&&el.hasClass(class2))
{el.removeClass(class2);el.addClass(class1);}
else if(overrideClass==class2&&el.hasClass(class1))
{el.removeClass(class1);el.addClass(class2);}}
else
{if(el.hasClass(class1))
{el.removeClass(class1);el.addClass(class2);}
else if(el.hasClass(class2))
{el.removeClass(class2);el.addClass(class1);}}};})(jQuery);


<!-- HTML -->
<input type="checkbox" checked="checked" value="1" id="file_aktiv" name="file_aktiv"/>
<label for="file_aktiv" class="fb_icon file_active">aktiv</label>
<input type="checkbox" checked="checked" value="1" id="file_public" name="file_public"/>
<label for="file_public" class="fb_icon file_public">öffentlich</label>
Initial URL 
http://www.interaktionsdesigner.de/2008/11/28/verkettete-funktionen-und-checkboxen-mit-jquery/
Initial Description 
ändern der Klasse bei checkbox aktion
Initial Title 
Switch label class for checkbox
Initial Tags 
form
Initial Language 
jQuery