Jquery 用另一种颜色替换颜色,以便仅在TD中匹配
只有当td中的背景色属性与需要替换的颜色匹配时,我才需要替换它Jquery 用另一种颜色替换颜色,以便仅在TD中匹配,jquery,Jquery,只有当td中的背景色属性与需要替换的颜色匹配时,我才需要替换它 <td style="background-color:#AEE0EC;">24</td> <td style="background-color:#cE00Ef;">25</td> <td style="background-color:#EEAABB;">26</td> <td style="background-color:#CCCCC;">2
<td style="background-color:#AEE0EC;">24</td>
<td style="background-color:#cE00Ef;">25</td>
<td style="background-color:#EEAABB;">26</td>
<td style="background-color:#CCCCC;">27</td>
<td style="background-color:#001122;">28</td>
您可以迭代td并使用jquery.css获取颜色,它将为每个VackGrand颜色提供一个RGB值。然后,您可以将该rgb值传递给函数,以将其转换为十六进制值-注意,我使用@Erick Petrucelli提供的上一个SO答案来表示此转换函数。然后可以将其与目标值进行比较,并通过设置.css背景色进行交换 这是一个快速答案,并将值设置为小写。我建议让它更健壮,并显式地将值设置为小写或大写,但它完成了任务 $document.readyfunction{ $'tableTest td'。每个函数{ var originalColor=ce00ef; var replacementColor=ff0000; var tdColor=$this.css'background-color'; var convertedColor=convertColortdColor; ifconvertedColor.trim==originalColor{$this.css'background-color',replacementColor}; } 函数convertColortdColor{ var rgb=tdColor.match/^rgb\\d+,\s*\d+,\s*\d+\$/; 函数hexx{ 返回0+parseIntx.toString16.slice-2; } return+hexrgb[1]+hexrgb[2]+hexrgb[3]; } } 原始表格-检查td,其中有25个 24 25 26 27 28 修改表-检查td,其中有25个 24 25 26 27 28
如果要选择bg颜色为ffff00的元素,可以执行$[style*='background-color:ffffff00'],这将给出bg颜色设置为ffff00的元素列表 函数replaceColorToBereplace,newColor{ var$elements=$[style*='background-color:+colorToBeReplaced+']; $elements.cssbackground color,newColor; }; $document.readyfunction{ //替换颜色001122,E6; replaceColor001122,透明;//以防按照OP建议移除bg }; 24 25 26 27 28
仅供参考,您的小提琴中的背景颜色与您发布的代码中的背景颜色不同。css将返回rgb格式,因此,转换或字符串搜索/替换在样式属性中…这只是一个示例,我需要知道如何用另一种颜色替换颜色,如果它是matches@Learning,如果颜色将位于样式属性内:,如果不是,你会得到RGB格式的,所以你的搜索也应该是RGB,或者你必须将其转换为你需要的值…@Learning--看看我的答案,我也更新了脚本,但它不起作用,因为我有多个日历表注意,你需要迭代每个日历中的每个td-你似乎只是在每个表上交互。另外-您正在导入jquery库并在文档中包装hte函数吗?是的,我正在使用Knockout获取日历数据&出于这个原因,我正在使用SetTimeout函数来确保在数据下载之前函数是否未运行。问题是,这似乎是开发人员代码中的一个bug,因为这种颜色不在数据库日历控件中,只是从某个地方添加的
setTimeout(function(){
$('td').each(function() {
if($(this).attr('style').split(':')[1]==="#AEE0EC;") {
$(this).css('background-color','#ffffff;');
}
});
}, 5000);