Home  >  Article  >  Web Front-end  >  How to use input in javascript

How to use input in javascript

藏色散人
藏色散人Original
2021-04-27 09:03:0312315browse

Usage of input in JavaScript: First create an HTML sample file; then create a form in the body and specify an input field through the input tag; finally enter the form control element object method in the js code.

How to use input in javascript

The operating environment of this article: windows7 system, javascript version 1.8.5, Dell G3 computer.

Common input methods in JavaScript

##Common events for form objects: onfocus: Triggered when the form element receives input focus;
onblur: Triggered when the form element loses input focus.
For example: when the text box loses focus, the following code will call the myfun() function.

Common methods of form control element objects blur()
Let the cursor leave the current element

focus()

Let the cursor fall Go to the current element

select()

Used for elements of type text, textarea, password to select the content entered by the user

click()

Imitates a mouse click on the current element Element

Effect display
How to use input in javascript
Code implementation

<!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>

[Recommended learning:

javascript Advanced Tutorial

The above is the detailed content of How to use input in javascript. For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn