jQuery .serialize()发送默认输入值,而不是更新

时间:2011-12-28 01:28:44

标签: jquery ajax forms post

我创建了一个简单的表单和jQuery插件,将表单提交到PHP脚本,然后将其添加到数据库中。不过,jQuery的.serialize()提交的表单是默认的输入值,而不是用户键入的值,这应该不是什么大不了的事。

这是HTML:

<form id="submit-assignment" method="post" action="URL-HERE">
    <input type="hidden" value="1" name="class_id">
    <div id="assignment-title-parent" style="width: 367px;">
    <input id="assignment-title" class="new-name" type="text" value="Name a new assignment." style="border-right: 0pt none; height: 14px;" name="assignment-title">
    <div id="assignmentadd-step2" class="btn leftflat next-right" style="height: 14px;">Next »</div>
    <div class="clear"></div>
    </div>
    <div id="assignment-desc-parent" class="hidden">
    <textarea id="assignment-desc" class="new-desc" name="assignment-desc" style="">Describe this assignment here. Include directions, resources, etc.</textarea>
    <div style="width: 310px;">
    <div id="assignmentadd-step3" class="btn fr" style="margin-top: 2px;">Next »</div>
    <div class="fl txt-small txt-gray top6">
    <input id="assignment-date" class="new-date hasDatepicker" type="text" value="When is it due?" name="assignment-date">
    </div>
    <div class="clear"></div>
    </div>
    </div>
    <div id="assignment-preview-parent" class="hidden">
    </form>

插件:

jQuery.fn.submitForm = function(callback) {      

    $(this).submit(function(event) {
           event.preventDefault();
            //alert($(this).serialize());
           $.post($(this).attr("action"), $(this).serialize(), function(data) {   

                if(typeof callback == 'function'){
                     callback.call(this, data);
                }

            }, 'json');
    });
};

插件用法:

$(document).ready(function() {
    $('#submit-assignment').submitForm(function() { 
        //-> callback...
    });     
});

谢谢:)

1 个答案:

答案 0 :(得分:0)

Serialize将获取表单中所有输入字段的任何值以进行提交。如果您打算将它们作为占位符,则可以执行以下操作:

<input name="assignment-title" value="" placeholder="placeholder text goes here" />

此外,占位符是HTML5,因此,根据我个人的喜好,我创建了一个函数作为占位符后备。我编辑了jsfiddle.net作为例子。

http://jsfiddle.net/Rcqry/