CODEWITHSUNDEEP
javascriptjquery
monda
monda

Reputation: 3915

Jquery- Find the element has given style property

i have a html table 

    <table class="mytable">
       <tr>
           <td>
            test value
           </td>
       <tr>
    </table>

on loading the page dynamically adding a td 

        $(".mytable tr:first").append("<td id='scheduledInMyLearnStatus' class='changeFieldValue' style='background-color:#FE2E2E;'></td>");

now on clicking the that particular td i want to compare whether its has backgroung color =#FE2E2E or has anything else

    $('td').live('click', function() {

       //compare here 
    });

Upvotes: 1

Views: 201

Answers (3)

GajendraSinghParihar
GajendraSinghParihar

Reputation: 9131

You can make your function look like

$('.mytable td').live('click', function() {

        bgColor= hexc($(this).css("background-color"));
        if(bgColor.toUpperCase() == "#FE2E2E")
        {
            alert("Background color matched to '#FE2E2E'")
        }
        else
        {
            alert("Background color don't  matched to '#FE2E2E'")
        }

    });

and Defination for hexc will be

function hexc(colorval) 

{
    var color = "";
    var parts = colorval.match(/^rgb\((\d+),\s*(\d+),\s*(\d+)\)$/);
    if(parts != null )
    {
        parts[0] = "#";
        for (var i = 1; i <= 3; ++i) 
        {
            parts[i] = parseInt(parts[i]).toString(16);
            if (parts[i].length == 1) parts[i] = '0' + parts[i];
        }
        color = parts.join('');
    }
    return color;
}

Upvotes: 1

Vladislav Qulin
Vladislav Qulin

Reputation: 1932

I believe you can use just one selector:

$(document).on("click", ".changeFieldValue[style~='background-color']", function () {
  // do something
});

And if u need the determined color, 'background-color: rgb(200, 122, 122)' instead of just 'background-color'.

Upvotes: 1

Ram
Ram

Reputation: 144729

You can use jQuery css() method, please note that live() is deprecated you can use on instead:

$(document).on('click', '#scheduledInMyLearnStatus', function(){ // or $('.mytable').on
    if($(this).css('background-color') == "rgb(254, 46, 46)") {
      // do something
    }
})

DEMO

Upvotes: 4

Related Questions