javascript - Jquery-查找具有给定样式属性的元素

Question

我有一个 html 表

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

在动态加载页面时添加 td

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

现在点击那个特定的 td 我想比较它是否有背景颜色 =#FE2E2E 或有其他东西

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

       //compare here 
    });

Answer 1

您可以使用 jQuerycss()方法，请注意live()已弃用，您可以on改用：

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

演示

Answer 2

我相信你可以只使用一个选择器：

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

如果你需要确定的颜色，'background-color: rgb(200, 122, 122)' 而不仅仅是'background-color'。

Answer 3

你可以让你的功能看起来像

$('.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'")
        }

    });   

和 hexc 的定义将是

函数十六进制（颜色值）

{
    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;
}