3

在这里，我有一个无法解决的问题。这是代码，我希望脚本在输入的文本更改时更改表单输入的颜色：

function checkName(name)
{
if (name.value == "value1" || name.value == "value2" || name.value == "value3" || name.value == "value4" || name.value == "value5" || name.value == "value6"){
 document.forms['un'].elements['name'].style.color='#ffbb00'
}
else {
 document.forms['un'].elements['name'].style.color='#000000'
}
}

正如您所看到的，当输入的文本与提供的文本之一匹配时，它应该变成橙色，如果不匹配，它应该是黑色的。（我有一个用 onChange 切换这个函数的输入）我只是不能让它工作，所以我可以有多种选择何时改变颜色，并且当语句变得无效时也可以改变回来。有什么帮助吗？

4

4 回答 4

2

试试这个：

function checkName(element) {
    if (element.value == ...) {
        element.className = "inputError";
    } else {
        element.className = "";
    }
}

然后在你的 CSS 文件中：

.inputError {
    background-color: #FF0000;
    background-image: url(exclamation_mark.png);
    background-position: right 50%;
    background-repeat: no-repeat;
    background-size: contain;
    -moz-background-size: contain;
    -webkit-background-size: contain;
    -o-background-size: contain;
}

现在您已经预定义了输入框的 CSS 样式，每次检查输入框时都可以将其设置为适当的 CSS 类名称。

现在你所要做的就是：

<input id="myTextBox" type="text" onkeyup="javascript: checkName(this);" />

希望这可以帮助！

于 2012-04-20T21:23:27.163 回答
2

I have an input toggling this function with an onChange thing so your Input 

<input type=text size=20 name='name' onchange="checkName(this)">

and function could be

function checkName(el)
{
    if (el.value == "value1" || el.value == "value2" || el.value == "value3" || el.value == "value4" || el.value == "value5" || el.value == "value6")
    {
        el.style.color='#ffbb00'
    }
    else
    {
        el.style.color='#000000'
    }
}

An example.

You may also try onkeyup like this example.

于 2012-04-20T21:26:15.113 回答
1

您假设文本框中的值自动传递给函数 checkName。我相信这是你的错误。

您可以checkName使用引用函数内文本框中的值event.srcElement.value。

于 2012-04-20T21:24:56.853 回答
1
于 2012-04-20T21:25:24.797 回答