jquery - 使用 jQuery 为元素数组添加带有删除选项的复选框

Question

我是 jQuery 和 JS 的新手。我一直想知道如何为数组 aCurrency 中的每个元素添加一个复选框，这样我就可以删除该数组中的一个或多个元素。我的想法是使用下面方法中已有的 for 循环 来完成此操作。

我多次尝试对此进行编码，但均未成功，因此我们将非常感谢您的任何意见。

function showHideCurrencies() {
    $("#lblCurrencies").empty();
    if (bShown == 0) {
        $("#btnShowHideCurrencies").text("HIDE CURRENCIES");
        bShown = 1;
        for (var i = 0; i < aCurrencies.length; i++) {
            $("#lblCurrencies").append("<div>" + aCurrencies[i] + "<i data-arrayIndex='" + i + "' class='fa fa-trash-o fa-fw'></i></div>")
        }
        $("#lblCurrencies").show();
    } else {
        $("#btnShowHideCurrencies").text("SHOW CURRENCIES");
        bShown = 0;
        $("#lblCurrencies").hide();
    }
}

Answer 1

我准备了如下演示代码:

HTML:

<label id="lblCurrencies"></label>
<button id="btnShowHideCurrencies">

</button>

JQuery:

var bShown=0;
var aCurrencies=["first","second","third"];
showHideCurrencies();
function showHideCurrencies() {
    $("#lblCurrencies").empty();
    if (bShown == 0) {
        $("#btnShowHideCurrencies").text("HIDE CURRENCIES");
        bShown = 1;

        for (var i = 0; i < aCurrencies.length; i++) {
            $("#lblCurrencies").append("<div class>" + aCurrencies[i] + "<i data-arrayIndex='" + i + "' class='fa fa-trash-o fa-fw'></i><input type='checkbox' id='chk_"+i+"' /></div>")
        }
        $("#lblCurrencies").show();
    } else {
        $("#btnShowHideCurrencies").text("SHOW CURRENCIES");
        bShown = 0;
        $("#lblCurrencies").hide();
    }    

}

此代码会将具有唯一 ID 的复选框添加到您的标签中。

您可以在 fiddle 上查看演示 Click here.

希望对你有帮助