jquery - 使用 jquery 获取输入字段的 id 以传回颜色变化

Question

希望有人能指出我正确的方向。 我知道有类似的问题，但我还没有找到直接处理我想要实现的目标的问题。 我正在尝试获取输入字段的 ID，以便我可以更改字体颜色。

<div id="red">
    <input id="redA" type="text">
    <input id="redB" type="text">
    <input id="redC" type="text">
</div>
<div id="outerContainer">
    <div id="innerContainer">
        <div id="blue">
             <input id="blueA" type="text" onBlur="check()">
             <input id="blueB" type="text" onBlur="check()">
             <input id="blueC" type="text" onBlur="check()">
        </div>
     </div>
</div>

<script>
    function check(){
        var v=$(this).val();
        if ( v=="red" ) { $(this).css({"color":"red"})
        if ( v=="green" ) { $(this).css({"color":"green"})
        if ( v=="blue" ) { $(this).css({"color":"blue"})
    }
</script>

我知道这有点啰嗦，但希望可以看到我正在尝试做的事情 谢谢

Answer 1

你可以这样做

<div id="red">
    <input id="redA" type="text">
    <input id="redB" type="text">
    <input id="redC" type="text">
</div>
<div id="outerContainer">
    <div id="innerContainer">
        <div id="blue">
             <input id="blueA" type="text" onblur="check(this)">
             <input id="blueB" type="text" onblur="check(this)">
             <input id="blueC" type="text" onblur="check(this)">
        </div>
     </div>
</div>

JQuery

function check(vObj){
    console.log($(vObj));
    var v=$(vObj).val();
    if ( v=="red" ) { $(vObj).css({"color":"red"}); }
    if ( v=="green" ) { $(vObj).css({"color":"green"}); }
    if ( v=="blue" )  { $(vObj).css({"color":"blue"}); }
}

这是 http://jsfiddle.net/afPrc/109/ 的 jsfiddle

您的 fiddle 不工作的原因是因为您没有将文本框的对象传递给该函数。当您在函数内部执行 $(this) 时，它会获取 window 的对象而不是 textbox。