为什么我的javascript函数在被调用时会被执行?

时间:2014-10-05 19:10:23

标签: javascript html

我正在编写一个正则表达式来检查文本框中的字符是否只是字母和连字符,但出于某种原因,当我从onclick调用该函数时,它将不会执行。

<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function checkChar() {
    var validLetters = /^[A-Z]+[-]*[A-Za-z]/;
    var element = document.getElementById("firstName");
    var fname = element.value;

    if (fname.match(/^[A-Z]+[-]*[A-Za-z]/) {
        window.alert("correct");
    } else {
        window.alert("incorrect");
    }
}
</script>
</head>
<body>

<input type ="text" name ="firstName"/>
<button onclick="checkChar()">submit</button>

</body>
</html>

2 个答案:

答案 0 :(得分:0)

您正在按ID查找元素,但您只是给它命名。

因此,当您尝试访问element.value时,您会收到错误,因为该元素为null

首选修补方法是为input提供name id,通常两者都相同。

您还错过了if行的尾随括号。

这些错误的两个都会出现在浏览器的JavaScript控制台上,如果你看过的话。但是,在第一次出现之前,你需要修复后者。

答案 1 :(得分:0)

如果你想通过它的ID获取一个元素,那么它应该有一个id。

<input type="text" name="firstName" id="firstName" />

顺便说一句,如果您在提交之前尝试验证表单,则必须停止事件传播。