0

我有一个 HTML 表单，并使用序列化 jQuery 片段将表单数据转换为 JSON 表示，如下所示：Convert form data to JavaScript object with jQuery

我只能在 div 标签中显示 JSON 输出。但我想在表单提交按钮单击时在新文件或窗口中显示输出。

我在标题中的 jQuery 序列化片段：

$.fn.serializeObject = function()
{
    var o = {};
    var a = this.serializeArray();
    $.each(a, function() {
        if (o[this.name] !== undefined) {
            if (!o[this.name].push) {
                o[this.name] = [o[this.name]];
            }
            o[this.name].push(this.value || '');
        } else {
            o[this.name] = this.value || '';
        }
    });
    return o;
};
$(function() {
    $('form').submit(function() {
        $('#result').text(JSON.stringify($('form').serializeObject(), null, 4));
        return false;
    });
})

我的 HTML

<form id="student" method="post">
<label>Name: </label><input type="text" name="studentname" /><br />
<label>Age: </label><input type="text" name="age" /><br />
<label>City: </label><input type="text" name="city" />
<input type="submit" value="Submit" id="submitbutton" /><br />
</form>

<pre id="result"></pre>
4

1 回答 1

1

将结果放在新窗口中很容易 - 只需将提交部分更改为如下所示：

$(function() {
    $('form').submit(function() {
        var txt = JSON.stringify($('form').serializeObject());
        $('#result').text(txt, null, 4);
        var recipe =  window.open('','ResultWindow','width=600,height=600');
        var html = '<html><head><title>Result Window</title></head><body><div>' + txt + '</div></body></html>';
    recipe.document.open();
    recipe.document.write(html);
    recipe.document.close();
        return false;
    });
})

查看http://jsfiddle.net/u6z4X/

于 2012-11-21T05:48:02.780 回答