javascript - 优化 jQuery 代码 - 重复部分

Question

这个问题不太可能对任何 future 的访客有帮助；它只与一个较小的地理区域、一个特定的时间点或一个非常狭窄的情况相关，通常不适用于全世界的互联网受众。如需帮助使此问题更广泛适用， visit the help center 。

已关闭 10 年前。

这更多的是一个代码美化问题，但仍然......

我有这个 html:(缩短)

<div id="sablona" style="display:none;">
    <div style="position:relative;">
        <fieldset>
            <img class="sm_kont" src="../../include/img/remove_16.png" title="Smazat kontakt" alt="Smazat kontakt" />
            <legend></legend>
            <table>
                <tr>
                    <td>
                        <label for="jmeno_n">jméno</label>
                        <input name="jmeno_n" id="jmeno_n" type="text" value="" />
                    </td>
                    <td>
                        <label for="pohlavi_n">pohlaví</label>
                        <select name="pohlavi_n" id="pohlavi_n">
                            <option value="0"></option>
                            <option value="m">muž</option>
                            <option value="z">žena</option>
                        </select>
                    </td>
                </tr>
                <tr>
                    <td colspan="4">
                        <label for="adresa_n">adresa</label>
                        <textarea name="adresa_n" id="zpr_adresa_n" rows="3"></textarea>
                    </td>
                </tr>
            </table>
        </fieldset>
    </div>
</div>

我想复制它并改变它的一些关键属性。这是我使用的代码:

var count = 0;

function pridat_kontakt () {
    var novy_kontakt = $("#novy_kontakt").val();
    if (novy_kontakt.length == 0) alert("Typ kontaktu nemůže být prázdný!");
    else {
        var kopie = $("#sablona").children().clone(true);
        kopie.find("legend").text(novy_kontakt);
        kopie.find("label, input, select, textarea").each(function () {
            if (typeof $(this).attr("name") != 'undefined') {
                if ($(this).attr("name").length > 0) {
                    var new = $(this).attr("name") + count;
                    $(this).attr("name", new);
                }
            }
            if (typeof $(this).attr("for") != 'undefined') {
                if ($(this).attr("for").length > 0) {
                    var new = $(this).attr("for") + count;
                    $(this).attr("for", new);
                }
            }
            if (typeof $(this).attr("id") != 'undefined') {
                if ($(this).attr("id").length > 0) {
                    var new = $(this).attr("id") + count;
                    $(this).attr("id", new);
                }
            }
        });
        $("[name='fedit']").append(kopie);
        $("#novy_kontakt").val("");
        count++;
    }
}

一切都工作正常，只是看起来不太好。谁能想出一个美化它的方法吗？我的意思是 .each() 部分。

Answer 1

您可以声明一个函数并在每个部分中使用它:

var checkAttr = function(jelem, attrName) {
    var attrValue = jelem.attr(attrName);
    if (typeof attrValue != 'undefined' && attrValue.length > 0) {
        var newAttr = attrValue + count;
        jelem.attr(attrName, newAttr);
    }
}
kopie.find("label, input, select, textarea").each(function () {
       var jthis = $(this);
       checkAttr(jthis, "name");
       checkAttr(jthis, "for");
       checkAttr(jthis, "id");
});