Question

如果从函数返回true，如何更改文本框背景和边框颜色？ if return false我的文本框背景边框会改变，但是当返回true时它仍然是红色。我怎样才能解决这个问题？任何帮助将不胜感激。

的Javascript

function checkPostcode() 
{

    var message = "";

    if (document.mainform.POSTCODE.value.length != 5)
    {
        message += "Invalid entry. Postcode must be in 5 number.";
    }
    else
    {
        for (var i = 0; i < document.mainform.POSTCODE.value.length; i++)
        {
            var f = document.mainform.POSTCODE.value.charAt(i);
            if (!(parseFloat(f) >= 0) || !(parseFloat(f) <= 9))
            {
                var jdap = "no";
            }
        }

        if (jdap=="no")
        {
            message += "Invalid entry. Please enter numbers only.";
        }
    }

    if (message != "") 
    {
            document.getElementById("posterrMsg").innerHTML      = message;
            document.getElementById("posterrMsg").style.display  = "inline";
            document.getElementById("POSTCODE").style.border     = "thin solid red";
            document.getElementById("POSTCODE").style.background = "#FFCECE";
            document.mainform.POSTCODE.value = "";
            document.mainform.POSTCODE.focus();
            return false;
    }
    else{

            document.getElementById("posterrMsg").innerHTML         = "";
            document.getElementById("posterrMsg").style.display     = "";
            document.getElementById("POSTCODE").style.border        = "thin solid #CCCCCCC";
            document.getElementById("POSTCODE").style.background    = "FFFFFF";
        return true;
    }

}

HTML

 <label id="posterrMsg" class="errMsg"></label> 
 <input type="text" name="POSTCODE" id="POSTCODE" value="<%=POSTCODE%>" onblur="checkPostcode();" maxlength="5" />

Answer 1

只需更改

document.getElementById("POSTCODE").style.border = "thin solid #CCCCCCC";

到

document.getElementById("POSTCODE").style.border = "";

Answer 2

另一种选择：

document.getElementById("POSTCODE").className = "validPostcode";

或

document.getElementById("POSTCODE").className = "invalidPostcode";

如果您想添加更多样式。

这两个都是有效的选择。

我会稍微重构你的代码，也许会创建一个调用checkPostcode进行验证的外部函数。

Answer 3

使用！==所以

if (message !== "")

以便您检查相同的类型和值。

你的背景颜色也有几个类型。

参见JSFiddle工作here

onBlur更改文本框背景颜色

的Javascript

HTML

3 个答案: