Search jQuery

jQuery Forum

philj2011

Problem with toggleClass in IE8

in Using jQuery • 9 years ago

Hi All

I'm using a switch statement to see if the label for a checkbox has a particular id. If it does, I want it to toggle a class to format the checkbox. Works beautifully in IE9, FF, Opera, Safari, but IE8 has a kitten over it and does absolutely nothing. Here is an example of the line of code to set the toggle class, any ideas people as I have a client breathing down my neck at the moment.. LOL...

switch(event.target.id)
  {
   case "BP":
          $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesBV');
          $(this).toggleClass('checked');
          break;
   case "HC":
          $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesHC');
          $(this).toggleClass('checked');
          break;
   case "SA":
          $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesSA');
          $(this).toggleClass('checked');
          break;
   default:

Any help would be great... thanks

Phil

Replies(4)

jay.blanc..

Re: Problem with toggleClass in IE8

9 years ago

What is $(this) referring to?

BTW having a kitten != does absolutely nothing

just sayin'

philj2011

Re: Problem with toggleClass in IE8

9 years ago

Should have included the lines before the sqitch... here they are:

$('#venue_types li.venue input[type="checkbox"]').click(function(event)
    {
        switch(event.target.id)
        {
            case "BP":
                $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesBV');
                $(this).toggleClass('checked');
                break;
            case "HC":
                $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesHC');
                $(this).toggleClass('checked');
                break;
            case "SA":
                $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesSA');
                //$(this).toggleClass('checked');
                break;
            case "TC":
                $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesTC');
                $(this).toggleClass('checked');
                break;
            case "WV":
                $('label[for="'+ $(this).attr('id') +'"]').toggleClass('mapVtypesWV');
                $(this).toggleClass('checked');
                break;
            default:
        }
    });

The checkboxes have been coded as follows:

<label for="BP">
            <input class="venue_details" type="checkbox" name="venues[]" id="BP" value="Birthday Party Venue"/>
            Birthday Party Venues
        </label>

I'm hoping that $(this) is referring to the checkbox that has been selected...

philj2011

Re: Problem with toggleClass in IE8

9 years ago

Hi

I've worked out the issue... its was actually something to do with the CSS...

The original checkboxes had had their display set to none, rather that using positioning to move them off the left side of the screen...

Once I changed the CSS to move the checkboxes off screen, everything else worked the way I expected.

Phil