javascript - 在出错时更改文本字段边框的最简单方法

Question

如果文本字段不遵循特定格式，我正在尝试找出在文本字段周围放置红色边框的最简单方法。我的代码是检测文本格式是否正确的属性，但是当检查失败时我无法更改边框颜色。如果可能的话，我宁愿只使用 html/css 和 JavaScript，但我似乎不知道该怎么做。

这是我的文本框 html:

<p class="fieldtitle"> First Name </p>
<span><input type="text" class="textinput" id="fname" name="fname" /></span>

这是我的 JavaScript，用于检查格式是否正确:

function chkfName() {
    var myfname = document.getElementById("fname");
    var pos = myfname.value.search(/^[A-Z][a-z]+$/);

    if (pos != 0) {
        //this is where I want to change the border around the text box
        return false;
    } else
        return true;
}

Answer 1

您可以像这样轻松更改它!

function chkfName() {
var myfname = document.getElementById("fname");
var pos = myfname.value.search(/^[A-Z][a-z]+$/);

if (pos != 0) {
    fname.style.borderColor = "red";
    return false;
} else
    return true;

这是一些关于它的文档:http://www.w3schools.com/js/js_htmldom_css.asp