jQuery克隆具有最新用户输入的输入表

Question

我正在尝试重用一个输入表。我的想法是使用jquery保存输入表的最终状态，然后将其添加到输出页面。然而，我的代码只保存默认输入，这意味着用户所做的任何更改都不会被保存。那么，对这个问题有什么建议吗？例如，如何让下拉输入元素使用jquery保存用户选择（我有大约100个输入元素，所以如果代码非常通用，那就太好了）。谢谢

HTML代码：

<table class="tab">
    <tr>
        <th colspan="3" scope="col">
            <label for="id_nott">No. of Time-Varing Factors:</label>
        </th>
        <td colspan="1" scope="col">
            <select name="nott" id="id_nott">
                <option value="1">1</option>
                <option value="2">2</option>
            </select>
        </td>
    </tr>
</table>
<input class="submit input_button" type="button" value="Click" />

jQuery:

$("input[value='Click']").click(function () {
    var html_input = $(".tab").clone().html();
    console.log(html_input)
})

JSFiddle

Answer 1

演示

http://api.jquery.com/serialize/--获取和传递输入状态的简单方法，但必须将html封装在form标记中。

$("input[value='Click']").click(function (){
    $("form").on( "submit", function (event){
      event.preventDefault();
      console.log($(this).serialize());
    });    
});

输出：

nott=2

推荐：

尝试对id和name属性使用常规命名。