如果不使用 JQuery，我在一个页面上有多个表单，无需重写大量函数，您能帮我解决这个问题吗？
<html><head>
<script type="text/javascript">
function validPhone() {
if(document.all.[phoneVar].value.length <= 7)
alert("You must enter a valid phone number");
document.all.[phoneVar].focus() ;
return false;
}
</script>
</head><body>
<script type="text/javascript">
function checkThisParticularForm() {
var phoneVar = document.GetElementById('phone').value; //set element id
validPhone(); //this calls the validPhone function
}
</script>
<form action="./logging.php" method="post" enctype="multipart/form-data" name="NewCallForm" onsubmit="checkThisParticularForm();">
<input type="text" class="textbox" id="phoneNumber" name="phoneNumber" value="" />
<input type="submit" value="Submit Details">
</form>
</body></html>
在提交每个表单时，我希望它验证某些字段，在本例中是电话号码，但我想创建 1 个可以由其他表单调用的主函数，因此它包含一个变量 [phoneVar] 我试图在调用该函数之前声明它。
抱歉，如果这很简单，我不擅长 JavaScript，感谢任何帮助/指示。
最佳答案
这里有一个简单的方法来做到这一点，但首先您必须将所有表单包装在 div id="allforms" 中。
window.onload = function () {
document.getElementById('allforms').addEventListener('submit', function (e) {
var pn = e.target.phoneNumber;
if (pn.value.length <= 7) {
alert("You must enter a valid phone number");
pn.focus() ;
e.preventDefault();
}
});
}
这个想法是，submit 事件冒泡到 div，而您只需要做的就是监听该 submit 事件div。这称为事件委托(delegate)。
e.target指的是触发事件的元素。在本例中，要提交的是 form 元素。
由于 e.target 是一个 form，因此您可以直接引用命名的 form 元素。 document.all 是 IE 特定的，在 IE11 中已废弃。
e.preventDefault() 阻止事件后的默认操作，在这种情况下，它阻止提交表单。
如果您也需要 IE<9 的支持，请告诉我，我将添加代码。
关于javascript - 页面上有多种表单，最少的验证功能，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/23273604/