做更好的自己 网站seo优化 搜 盈seo公司
1 代码示例
要判断输入值是数字还是字母，我们可以通过JavaScript获取输入框的值，然后使用isNaN函数来检查输入值是否为数字。
<!DOCTYPE html>
<html><head><meta charset="UTF-8"><title></title><script>window.onload = function() {const { myForm } = document.forms;if (myForm) {myForm.addEventListener('submit', (e) => {e.preventDefault();const x = myForm.age.value;if (isNaN(x)) {alert("必须输入数字");}});}};</script></head><body><form name="myForm">年龄: <input type="text" name="age"><input type="submit" value="提交"></form></body>
</html>
以上代码中我们通过JavaScript代码来获取表单，并检查age字段中是否输入了数字。
2 代码讲解
2.1 获取表单元素
const { myForm } = document.forms;通过document.forms获取表单，并使用解构赋值的方式获取我们需要的myForm表单。
2.2 添加提交事件监听器
myForm.addEventListener('submit', (e) => {e.preventDefault();使用addEventListener方法监听表单的submit事件，并在事件触发时执行回调函数。回调函数中，首先调用e.preventDefault()来阻止表单的默认提交行为。
2.3 获取输入框的值
const x = myForm.age.value;从表单中获取age输入框的值。
2.4 检查输入值是否为数字
if (isNaN(x)) {alert("必须输入数字");
}使用isNaN函数检查输入值是否为数字。如果isNaN返回true，说明输入的不是数字，此时弹出警告框提示用户“必须输入数字”。