Today I will teach you how to use H5 to make a drop-down box with small special effects. When you click on the content of the drop-down box, a small special effect will appear in the text field. Let's take a look at the detailed case code.
There is a drop-down box in HTML, including "wind, rain, thunder, lightning", add an event, when wind is selected, a selection appears in the text field
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<form name="form_name" >
<select name="select_name" onChange="ShowToText(); " >
<option value="1">风</option>
<option value="2">雨</option>
<option value="3">雷</option>
<option value="4">电</option>
</select><br>
<textarea rows="3" cols="30"name="textfield_name3">
</textarea>
</form>
</body>
<script language="JavaScript">
function ShowToText(){
document.form_name.textfield_name3.value=document.form_name.select_name.options[document.form_name.select_name.selectedIndex].text
}
</script>
</html>Running effect
I believe you have mastered the methods after reading these cases. For more exciting information, please pay attention to other related articles on the php Chinese website!
Related reading:
Notes on table nesting in HTML
Details of HTML5 tag nesting rules Introduction
html5 tutorial on making moon cake eating game
The above is the detailed content of Use H5 to create a drop-down box with special effects. For more information, please follow other related articles on the PHP Chinese website!
What are the production methods of html5 animation production?
The difference between HTML and HTML5
linux view version information
What does data encryption storage include?
mpvue sum vue division
How to use each function in js
Why disabling automatic updates in Windows 11 is invalid
What does the metaverse concept mean?
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
