Detailed explanation of jquery tag selector application example
|
This article example shares the specific code of jQuery tag selector application for your reference. The specific content is as follows 1. Set div content uniformly You can use the tag selector to select all div elements;
<!DOCTYPE html>
<html>
<head>
<title></title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
function setdiv()
{
$("div").html('Set content uniformly;');
}
</script>
</head>
<body>
<h1></h1>
<div id="div1" style="border:1px solid #0F0;width:150px;height:50px;"></div>
<p></p>
<div id="div2" style="border:1px solid #0F0;width:150px;height:50px;"></div>
<p></p>
<div id="div3" style="border:1px solid #0F0;width:150px;height:50px;"></div>
<p></p>
<div id="div4" style="border:1px solid #0F0;width:150px;height:50px;"></div>
<p></p>
<div id="div5" style="border:1px solid #0F0;width:150px;height:50px;"></div>
<p></p>
<button onclick="setdiv()">Set content</button>
</body>
</html>
2. jQuery gets all the data of the form serialize() method, Serialize the form content into a string;
<!DOCTYPE html>
<html>
<head>
<title>Form</title>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js"></script>
<script>
function getform()
{
var data = $("form").serialize();
alert('form data:' + data);
}
</script>
</head>
<body>
<h1>Registration form</h1>
<form action="" method="get">
<p>
<label>Username:</label>
<input type="text" name="user" />
</p>
<p>
<label>Password:</label>
<input type="password" name="password" />
</p>
<p>
<label>Gender:</label>
<input type="radio" name="gender" value="0" /> Male<input type="radio" name="gender" value="1" /> Female</p>
<p>
<label>Love Good:</label>
<input type="checkbox" name="like" value="0"> Learn<input type="checkbox" name="like" value="1"> python
<input type="checkbox" name="like" value="2"> Swimming</p>
<p>
<label>Personal introduction:</label>
<textarea name='introduce'></textarea>
</p>
<p>
<label>Native origin:</label>
<select name="site">
<option value="0">Beijing</option>
<option value="1">Shanghai</option>
<option value="2">Henan</option>
<option value="3">Hebei</option>
<option value="4">Shandong</option>
</select>
</p>
<p>
<input type="submit" name="" value="Submit1">
<input type="reset" name="" value="Reset 1">
</p>
</form>
<button onclick="getform()">Get Form</button>
</body>
</html>
$("form"), also a tag selector; The above is the full content of this article. I hope it will be helpful for everyone’s study. I also hope that everyone will support 123WORDPRESS.COM. You may also be interested in:
|
>>: Detailed tutorial on building Gitlab server on CentOS8.1
Recommend
Pitfalls encountered when installing MySQL 8.0.18 compressed package and resetting forgotten passwords
http://www.cppcns.com/shujuku/mysql/283231.html Y...
MySQL paging query optimization techniques
In applications with paging queries, queries that...
Summary of 4 solutions for returning values on WeChat Mini Program pages
Table of contents Usage scenarios Solution 1. Use...
Detailed discussion of InnoDB locks (record, gap, Next-Key lock)
Record lock locks a single index record. Record l...
Teach you how to insert 1 million records into MySQL in 6 seconds
1. Idea It only took 6 seconds to insert 1,000,00...
Detailed tutorial on jdk installation and environment variable configuration under Win10
Table of contents Preface 1. Preparation 2. Insta...
React Native JSI implements sample code for RN and native communication
Table of contents What is JSI What is different a...
Mysql optimization techniques for querying dates based on time
For example, to query yesterday's newly regis...
Understand the usage of Vue2.x and Vue3.x custom instructions and the principle of hook functions
Table of contents Vue2.x Usage Global Registratio...
Apache Flink arbitrary Jar package upload leads to remote code execution vulnerability recurrence problem (vulnerability warning)
Vulnerability Description Apache Flink is an open...
Detailed explanation of the process of deploying Tomcat and creating the first web project in IDEA 2020.3.1
Table of contents Tomcat Introduction Tomcat depl...
A quick guide to MySQL indexes
The establishment of MySQL index is very importan...
Solve the error during connect exception in Docker
When you first start using Docker, you will inevi...
Restart all stopped Docker containers with one command
Restart all stopped Docker containers with one co...
MySQL 5.7.17 Compressed Version Installation Notes
This article shares the installation steps of MyS...