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
Solution to the problem of incomplete display of select drop-down box content in HTML and partial coverage
Today, I encountered a problem: the content in the...
Application nesting of HTML ul unordered tables
Application nesting of unordered lists Copy code T...
Sample code for easily implementing page layout using flex layout
Without further ado, let's get straight to th...
Explanation of the process of docker packaging node project
As a backend programmer, sometimes I have to tink...
Implementation steps for building Webpack5-react scaffolding from scratch (with source code)
Table of contents webpack5 Official Start Buildin...
Detailed installation tutorial for MySQL zip archive version (5.7.19)
1. Download the zip archive version from the offi...
Docker mounts local directories and data volume container operations
1. Docker mounts the local directory Docker can s...
Install mysql 5.6 from yum source in centos7.4 system
System environment: centos7.4 1. Check whether th...
Detailed explanation of vue simple notepad development
This article example shares the specific code of ...
JavaScript to achieve the effect of clicking on the self-made menu
This article shares the specific code of JavaScri...
Summary of using MySQL online DDL gh-ost
background: As a DBA, most of the DDL changes of ...
Detailed explanation of Nginx status monitoring and log analysis
1. Nginx status monitoring Nginx provides a built...
React + Threejs + Swiper complete code to achieve panoramic effect
Let’s take a look at the panoramic view effect: D...
JavaScript adds prototype method implementation for built-in objects
The order in which objects call methods: If the m...
A brief discussion on Axios's solution to remove duplicate requests
Table of contents 1. Cancel duplicate requests 2....