JavaScript獲取表單輸入框內容的幾種方法

<!DOCTYPE HTML>
<html>
<head>
	<meta charset="utf-8" />
	<title>form</title>
	<script type="text/javascript">
		function f(){
			//方法一:
			var firstName = document.getElementById("first").value;
			var lastName = document.getElementById("last").value;
			console.log(firstName + "  " + lastName);
			
			//方法二:
			var firstName2 = document.login.firstName.value;
			var lastName2 = document.login.lastName.value;
			console.log(firstName2 + "  " + lastName2);
			
			//方法三
			var firstName3 = document.forms[0].firstName.value;
			var lastName3 = document.forms[0].lastName.value;
			console.log(firstName3 + "  " + lastName3);
			
			//方法四:
			var firstName4 = document.forms["myform"].firstName.value;
			var lastName4 = document.forms["myform"].lastName.value;
			console.log(firstName4 + "  " + lastName4);
			
			
			//方法五:
			var firstName5 = login.firstName.value;
			var lastName5 = login.lastName.value;
			console.log(firstName5 + "  " + lastName5);
		}
	</script>
	
</head>
<body>
	<form action="#" name="login" id="myform">
		first name: <input type="text" name="firstName" id="first" /><br/>
		last name: <input type="text" name="lastName" id="last" /><br/>
		<input type="button" value="確定" onclick="f()" /><br/>
	</form>
	

</body>
</html>

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章