首頁 > web前端 > js教程 > javascript中input怎麼用

javascript中input怎麼用

藏色散人
發布: 2023-01-05 16:11:43
原創
12335 人瀏覽過

javascript中input的用法:先建立一個HTML範例檔;然後在body中建立一個form表單並透過input標籤規定一個輸入欄位;最後在js程式碼中輸入表單控制項元素物件方法即可。

javascript中input怎麼用

本文操作環境:windows7系統、javascript1.8.5版、Dell G3電腦。

JavaScript中input常用方法

#表單物件常用事件:
onfocus:在表單元素收到輸入焦點時觸發;
onblur:在表單元素失去輸入焦點時觸發。
如:當文字方塊失去焦點時,下列程式碼將呼叫myfun()函數。

表單控制項元素物件常用方法
blur()
讓遊標離開目前元素

focus()
讓遊標落到目前元素上

select()
用於種類為text,textarea,password的元素,選擇使用者輸入的內容

click()
模仿滑鼠點選目前元素

效果展示
javascript中input怎麼用
程式碼實作

<!DOCTYPE html><html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<p id="info">
			<h2>填写相关信息</h2>
			<form action="" method="post">
				<input type="text" name="name" id="name" value="姓名" />
				<br />
				<input type="text" name="contact" id="contact" value="QQ或者电话" />
			</form>
		</p>
		<script type="text/javascript">
			window.onload = function() {
				var inname = document.getElementsByTagName("input");
				for (i = 0; i < inname.length; i++) {
					//使用匿名函数
					inname[i].onmouseover = function() {
						this.focus();
					}
					inname[i].onfocus = function() {
						this.select();
					}
				}
			}
		</script>
	</body></html>
登入後複製

【推薦學習:javascript進階教學

以上是javascript中input怎麼用的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:php.cn
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板