Question

我正在从Adriaan de Jonge和Phil Dutson的一本名为jQUery，jQuery UI和jQuery Mobile Recipes and examples的书中做一些例子。这应该是在页面上显示表单内容的简单方法。除非我有拼写错误，否则我不知道为什么它不起作用。

<!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>

Answer 1

您似乎缺少id选择器。

$('serialize')应该是$('#serialize')

  ^----  Missing Here

$('serialize-array')应该是$('#serialize-array')

  ^----  Missing Here

<强>代码

$(document).ready(function () {

    $('#serialize').click(function () {
        $('#placeholder').html($('form').serialize());
    });


    $('#serialize-array').click(function () {
        $('#placeholder').html(JSON.stringify(
        $('form').serializeArray()));
    });

});

Answer 2

$('serialize-array')必须与$('#serialize-array')相同，与serialize相同。缺少#。

从书中直接拿了这个 - 不起作用

2 个答案: