<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta
name="viewport"
content="width=device-width, initial-scale=1.0,maximum-scale=1,minimum-scale=1,user-scalable=no"
/>
<title>06-快速获取form表单input标签的值.html</title>
<style>
* {
margin: 0;
padding: 0;
box-sizing: border-box;
}
</style>
</head>
<body>
<form>
<input type="text" name="username1" /><input
type="text"
name="username2"
/><input type="text" name="username3" /><input
type="text"
name="username4"
/><input type="text" name="username5" /><input
type="text"
name="username6"
/><input type="text" name="username7" /><input
type="text"
name="username8"
/><input type="text" name="username9" /><input
type="text"
name="username10"
/>
<button>获取表单数据</button>
</form>
<script src="./lib/jquery.js"></script>
<script>
const form = document.querySelector('form');
form.addEventListener('submit', function (event) {
event.preventDefault();
const query = $('form').serialize();
console.log(query);
});
</script>
</body>
</html>