テキストボックスの背景色を取得

Question

私はJqueryを初めて使っています。私の無知を許してください。ページの読み込み時に異なる色でテキストボックスを設定するページがあります。特定の色をフィルタリングする、つまり特定のチェックボックスをクリックするだけで1色しか表示しないという要件があります。

私がやろうとしていること：私は行ごとに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(); 
    } 

Answer 1

「緑色」は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(); 
    } 
}); 

Answer 2

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

を次のようにあなたはRGB値を取得するjQueryのを使用して背景色を取得することができます。あなたが進値にこれを変換したい場合は、以下の機能を使用することができます

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) : ''; 
} 

EDIT

はあなたのテキストボックスを保持するためのテーブルがあるとします。あなたはこのようなことをすることができます

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

Answer 3

私はpropbelmがこの行にあると思います。 HTMLを共有していないので、この要素にstyle属性があるかどうかを理解することはできません。

v.style.background 

何のスタイル属性が存在しない場合v.styleはCSSStyleDeclarationを与えるだろうが、すべては空の値を持つことになります。

この例下記

HTML

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

JS

var v = document.getElementById("abc"); 
var v2 = v.style.background 
console.log(v.style.background); // red 

DEMO

などの要素に定義されたスタイル属性が存在する場合3210

がログに記録するred

要素にスタイル属性が定義されていない場合は、getComputedStyleプロパティを使用して値を取得できます。しかし、この場合、値はrgb形式になります。

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

DEMO2