我正在从 Adriaan de Jonge 和 Phil Dutson 的一本名为 jQUery、jQuery UI 和 jQuery Mobile 食谱和示例的书中做一些示例。这应该是一种在页面上显示表单内容的简单方法。除非我有错字,否则我不知道为什么它不起作用。
<!DOCTYPE html>
<html>
<head>
<title>form test</title>
</head>
<body>
<form action="" method="post">
<label for="first_field">First field</label>
<input type="text" name="first_field" value="" id="first_field"><br>
<label for="second_field">second field</label>
<input type="text" name="second_field" value="" id="second_field"><br>
<label for="third_field">third field</label>
<input type="text" name="third_field" value="" id="third_field"><br>
<label for="fourth_field">fourth field</label>
<input type="text" name="fourth_field" value="" id="fourth_field"><br>
</form>
<input type="button" name="serialize-array" value="serializeArray" id="serialize-array">
<input type="button" name="serialize" value="Serialize" id="serialize">
<hr>
<div id="placeholder"></div>
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script>
$(document).ready(function() {
$('serialize').click(function() {
$('#placeholder').html($('form').serialize());
});
$('serialize-array').click(function() {
$('#placeholder').html(JSON.stringify(
$('form').serializeArray()));
});
});
</script>
<hr>
</body>
</html>