submit/button表单交付区别 _Web前端

submit/button表单提交区别

???? 在js校验表单元素的时候,经常会出现如果某项为空,弹出....为空,并且把当前的<input type="text">那栏激活,光标指向当前激活的

???? 在提交的时候一般有2种

???? 1.一种为submit提交, 也称点击后自动提交

???? 2.另一种button,需要调用form.submit()方法,手动提交

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
 <HEAD>
  <TITLE> button/submit</TITLE>
 <script type="text/javascript">
		function subfrom(){
			var name=document.getElementById("name");	
			if(name.value==""){
				alert("用户名不能为空");
				name.focus();
				return false;
			}
		}

		function tjbtn(){
			var name2=document.getElementById("name2");	
			if(name2.value==""){
				alert("username不能为空");
				name2.focus();
			}else{
				document.getElementById("form").submit();
			}
		}
 </script>
 </HEAD>

 <BODY>
		<!--当按钮为submit时,自动会提交,需要用form的 onsubmit事件,值为空的时定义到当前的input-->
		<form action="" onsubmit="return subfrom();">
			<table>
				<tr>
					<td>用户名</td>
					<td><input type="text" id="name" name="name"></td>
				</tr>
				<tr>
					<td>密码</td>
					<td><input type="password" id="password" name="password"></td>
				</tr>
				<tr>
					<td rowspan="2"><input type="submit" id="subbtn" name="subbtn" value="提交"></td>
				</tr>
			</table>
		</form>
		<br><br>
		<br><br>
	
		<!--如果提交的类型是button的时候,需要手动提交form表单-->
		<form id="form" action="submit_button.html">
			 <table>
				<tr>
					<td>username</td>
					<td><input type="text" id="name2" name="name2"></td>
				</tr>
				<tr>
					<td>password</td>
					<td><input type="password" id="password" name="password2"></td>
				</tr>
				<tr>
					<td rowspan="2">
					  <input type="button" onclick="tjbtn()" value="submit">
					</td>
				</tr>
			</table>
		</form>
	
 </BODY>
</HTML>

?? 最近就纠结到js上了...悲剧...