Javascript 获取文本框的背景色

我是Jquery新手，请原谅我的无知。我有一个页面，在页面加载时设置不同颜色的文本框，要求过滤特定颜色，即单击特定复选框仅显示一种颜色

我想做的是： 我正在逐行遍历html表，试图获取每个文本框的当前颜色，如果颜色匹配，则保留它，否则隐藏文本框颜色不匹配的行。我看到过各种各样的帖子，它们显示了如何设置颜色，但没有显示如何检索文本框的当前颜色，在相同的行上尝试过，但没有运气，请帮助

$('input[id$=cbx]').click(function () {
 var v = document.getElementById("<%=TextBox3.ClientID%>");
 // to get the color value of current text box
 var v2 = v.style.background 
 // below also does not work
 var v2 = v.style.background.val()
 // below also does not work
 var v3= v.css('background-color');
 if (v2 == "green")
  {
   $('[id$=user1]').hide();
  }

$（'input[id$=cbx]'）。单击（函数（）{
var v=document.getElementById（“”）；
//获取当前文本框的颜色值的步骤
var v2=v.style.background
//下面也不行
var v2=v.style.background.val（）
//下面也不行
var v3=v.css（“背景色”）；
如果（v2=“绿色”）
{
$（'[id$=user1]'）。隐藏（）；
}

“绿色”是rgb（0、128、0） 试试这个

$('input[id$=cbx]').click(function () {
    var v = $('#<%=TextBox3.ClientID').css('background-color');
    if( v== 'rgb(0, 128, 0)') {
        $('[id$=user1]').hide();
    }
});

$（'input[id$=cbx]'）。单击（函数（）{
var v=$（'#'green'是rgb（0，128，0）
试试这个

$('input[id$=cbx]').click(function () {
    var v = $('#<%=TextBox3.ClientID').css('background-color');
    if( v== 'rgb(0, 128, 0)') {
        $('[id$=user1]').hide();
    }
});

$（'input[id$=cbx]'）。单击（函数（）{
var v=$（'#您可以使用jQuery获得背景色，如下所示

var bgColor = $('#textbox-id-here').css('background-color');

您将获得RGB值。如果您想将其转换为十六进制值，可以使用以下函数

function rgb2hex(rgb){
 rgb = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
 return (rgb && rgb.length === 4) ? "#" +
  ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : '';
}

编辑

假设你们有一张桌子来放你们的文本框，然后你们可以做这样的事情

$('#table-id tr td input[type=text]').each(function(){
  var bg = rgb2hex($(this).css('background-color'));
  if(bg==='#ff0000'){
    $(this).hide();
  }
});

您可以使用jQuery获得背景色，如下所示

var bgColor = $('#textbox-id-here').css('background-color');

您将获得RGB值。如果您想将其转换为十六进制值，可以使用以下函数

function rgb2hex(rgb){
 rgb = rgb.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
 return (rgb && rgb.length === 4) ? "#" +
  ("0" + parseInt(rgb[1],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[2],10).toString(16)).slice(-2) +
  ("0" + parseInt(rgb[3],10).toString(16)).slice(-2) : '';
}

编辑

假设你们有一张桌子来放你们的文本框，然后你们可以做这样的事情

$('#table-id tr td input[type=text]').each(function(){
  var bg = rgb2hex($(this).css('background-color'));
  if(bg==='#ff0000'){
    $(this).hide();
  }
});

我认为propbelm与这一行有关。由于您没有共享
HTML
，因此无法理解此元素是否具有
style
属性

v.style.background

如果没有样式属性
v.style
将给出，但所有属性都有空值

如果元素中定义了样式属性，如下面的示例所示

HTML

<input id= "abc" type = "text" class = "red" style = "background:red">


将记录
红色

如果元素上没有定义样式属性，则可以使用
getComputedStyle
属性获取值。但在这种情况下，值将采用
rgb
格式

var v = document.getElementById("abc");
var v2 = window.getComputedStyle(v, null);
console.log(v2.background)

我认为这一行是正确的。由于您没有共享
HTML
，因此无法理解此元素是否具有
样式
属性

v.style.background

如果没有样式属性
v.style
将给出，但所有属性都有空值

如果元素中定义了样式属性，如下面的示例所示

HTML

<input id= "abc" type = "text" class = "red" style = "background:red">


将记录
红色

如果元素上没有定义样式属性，则可以使用
getComputedStyle
属性获取值。但在这种情况下，值将采用
rgb
格式

var v = document.getElementById("abc");
var v2 = window.getComputedStyle(v, null);
console.log(v2.background)

添加html标记？为什么它被标记为c？添加html标记？为什么它被标记为c？很好的答案解释一切。html就是这样，我会试试你的建议，非常感谢！很好的答案解释一切。html就是这样，我会试试你的建议，非常感谢！