javascript - 在两个视图之间复制输入值的最佳方法

Question

我有两个不同的视图，它们具有相同数量的字段（复选框类型）要填写。

单击复制按钮时，我需要将值从一个视图复制到另一个视图。

这是我的有效代码：

$('button').on('click', function () {
    var firstInputSet = $('#contest_data_updatePeriodicity').find('input'),
        secondInputSet = $('#contest_data_reminderPeriodicity').find('input');
    for (var i = 0; i < firstInputSet.length; i ++) {
        //console.log($(firstInputSet[i]).prop('checked'));
        $(secondInputSet[i]).prop('checked', $(firstInputSet[i]).prop('checked'))
    }
});​

我想知道是否有最好的方法来完成这项工作。

这是演示：

http://jsfiddle.net/D2RLR/2639/

Answer 1

您可以克隆第一部分。

jsfiddle：http: //jsfiddle.net/D2RLR/2641/

$('button').on('click', function () {
    $("#second-set").empty();
    $('#contest_data_updatePeriodicity').clone().appendTo("#second-set").attr("id", "contest_data_second")
});​

优点：如果您决定添加某些内容，则不必添加两次。

缺点：可能不得不重新考虑您的“获取”功能，因为原始输入和重复输入共享相同的名称属性。不过很容易补救。

Answer 2

只需过滤您对复选框类型的搜索并使用 each 方法。

$('button').on('click', function () {
    var firstInputSet = $('#contest_data_updatePeriodicity').find('input:checkbox');
    var secondInputSet = $('#contest_data_reminderPeriodicity').find('input:checkbox');
    secondInputSet.each(function(i) { $(this).prop('checked', $(firstInputSet[i]).prop('checked')) });
});​