前端笔记-使用JavaScript防止空表单提交

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qq78442761/article/details/88987070

程序演示如下：

这里对应的ID卡号是没有填写的！

如果按下添加按钮

这里对应的JavaScript源码如下：

<script type="text/javascript">
	function myCheck()
	{
		for(var i=0;i<document.form1.elements.length-1;i++)
		{
			if(document.form1.elements[i].value=="")
			{
				alert("当前表单不能有空项");
				document.form1.elements[i].focus();
				return false;
			}
		}
		return true;
	}
</script>

这里使用html的doc属性，得到表单，然后遍历表单里面每一个属性是不是为空，如果为空！

就聚焦上去，然后返回

这里对应的form表单如下：

<form th:action="@{/student}" name="form1" method="post" onsubmit="return myCheck()">
    <input type="hidden" name="_method" value="put" th:if="${student!=null}"/>
    <input type="hidden" name="id" th:if="${student!=null}" th:value="${student.studentID}">