如何将 2 个 Jquery 代码合并为一个 [关闭]答案

【问题标题】：How To Combine 2 Jquery Codes Into One [closed]如何将 2 个 Jquery 代码合并为一个 [关闭]
【发布时间】：2012-10-30 05:12:02
【问题描述】：

我需要帮助将 2 个 jquery 代码合二为一。我将在同一页面上使用这两个代码。这是我的基本 HTML 代码：

<div class="filter">
    <label><input type="checkbox" id="one" />One</label>
    <label><input type="checkbox" id="two" checked="checked" />Two</label>
    <label><input type="checkbox" id="three" />Three</label>
    <label><input type="checkbox" id="four" checked="checked" />Four</label>
    <label><input type="checkbox" id="five" />Five</label>
    <label><input type="checkbox" id="six" checked="checked" />Six</label>
    <label><input type="checkbox" id="seven" checked="checked" />Seven</label>
    <label><input type="checkbox" id="eight" />Eight</label>
    <label><input type="checkbox" id="nine" checked="checked" />Nine</label>
    <label><input type="checkbox" id="ten" />Ten</label>
</div>

这是第一个jquery代码：

$(function() {
    var list = $("div.filter");
    var origOrder = list.children();
    var i, checked = document.createDocumentFragment();
    var unchecked = document.createDocumentFragment();
    for (i = 0; i < origOrder.length; i++) {
    if (origOrder[i].getElementsByTagName("input")[0].checked) {
            checked.appendChild(origOrder[i]);
        } else {
            unchecked.appendChild(origOrder[i]);
        }
    }
    list.append(checked).append(unchecked);
});

...这是第二个：

$(function() {
    var list = $("div.filter");
    var origOrder = list.children();
    list.on("click", ":checkbox", function() {
        var i, checked = document.createDocumentFragment();
        var unchecked = document.createDocumentFragment();
        for (i = 0; i < origOrder.length; i++) {
            if (origOrder[i].getElementsByTagName("input")[0].checked) {
                checked.appendChild(origOrder[i]);
            } else {
                unchecked.appendChild(origOrder[i]);
            }
        }
        list.append(checked).append(unchecked);
    });
});

这里是jsFiddle 链接。
谢谢。

【问题讨论】：

有什么问题？你被困在哪里了？

标签： javascript jquery html join merge

【解决方案1】：

由于单击处理程序和其他脚本本质上是相同的代码，因此您可以将其中一个转换为函数并通过名称引用它。

$(function() {
    var list = $("div.filter");
    var origOrder = list.children();

    function doWhateverThisDoes() {
        var i, checked = document.createDocumentFragment();
        var unchecked = document.createDocumentFragment();
        for (i = 0; i < origOrder.length; i++) {
            if (origOrder[i].getElementsByTagName("input")[0].checked) {
                checked.appendChild(origOrder[i]);
            } else {
                unchecked.appendChild(origOrder[i]);
            }
        }
        list.append(checked).append(unchecked);
    }

    list.on('click', ':checkbox', doWhateverThisDoes);
    doWhateverThisDoes();
});

【讨论】：

函数名幽默+1