其他语句不起作用是我的语法在jquery上不正确？

Question

Hi i am using if statement to change the opacity of a div on click event if a div is having the 0.5 opacity so it will change to 0 if its having 0 opacity so it will change to 0.5 i am using the following jquery code and it will change the opacity 0.5 to 0 but when i click again to change the opacity to 0 to 0.5 its not work. pls have a look on code

$("#one_star").click(function(){
    if($(this).css({"opacity":"0.5"}))
    {
        $(this).css({"opacity":"0"});
    }
    else if(!$(this).css({"opacity":"0.5"}))
    {
        $(this).css({"opacity":"0.5"});
    }
});

is i am using a wrong syntax? any suggestion pls

Answer 1

The expression $(this).css({"opacity":"0.5"}) you have in if should return boolean true or false but it does not so else is not executing.

try this,

if($(this).css("opacity") == "0.5")
 { 
        $(this).css({"opacity":"0"});
 }
 else 
 {
     $(this).css({"opacity":"0.5"});
 }

Answer 2

Your if 's are not actually checking the CSS opacity property.

You need to do this:

if ( $(this).css('opacity') == "0.5" ) {
   //do stuff
}

Answer 3

if( $(this).css("opacity") == "0.5") ){
        $(this).css({"opacity":"0"});
} else {
        $(this).css({"opacity":"0.5"});
}

Answer 4

No need to check if it's not, just use the else clause:

$("#one_star").click(function(){
    if($(this).css("opacity") === "0.5") {
        $(this).css({"opacity":"0"});
    } else {
        $(this).css({"opacity":"0.5"});
    }
});