代码之家 › 专栏 › 技术社区 › aronmoshe_m

通过多个变量jQuery循环显示给用户

jquery javascript

aronmoshe_m · 技术社区 · 4 年前

我在这里要做的是循环 donation 和 donation_cause ul#selected-amounts

<ul id="selected-amounts">
   <li>$FOO lorem ipsum BAR</li>
   <li>$FOO2 lorem ipsum BAR2</li>
</ul>

它现在在做什么:

<ul id="selected-amounts">
   <li>$FOO,FOO2 lorem ipsum BAR</li>
   <li>$BAR2</li>
</ul>

捐赠 显示为逗号分隔数组,并且 .each() 但我还没弄明白。

当前适用代码如下:

amount_chosen.change(function(){ //when the dollar amount changes

    var donation = [];
    var donation_cause = [];

    $.each($('input.dollar-value:checked'), function(){
        donation.push($(this).val());
        donation_cause.push($(this).attr('name'));
    });

    $("#selected-amounts").html("<li>&#36;"+donation+" to "+donation_cause.join("</li><li>&#36;")).css("display", "block");

});

谢谢您!

2 回复 | 直到 4 年前

Quentin 4 年前

将数组放入字符串中: "..." + donation + "..." 隐式地将其转换为字符串,这与调用 .join(",")

你需要一个循环。

这最好在您已经创建的循环中完成,而不是创建额外的数组。

您可以使用jQuery特性来转义任何特殊字符,并使代码在使用时不易出错

$("#selected-amounts").empty(); // Erase existing content

$.each($('input.dollar-value:checked'), function(){
    const donation = $(this).val();
    const cause = $(this).attr('name');
    $("#selected-amounts").append(
        $("<li />").text("$" + donation + " to " + cause);
    );
});

$("#selected-amounts").css("display", "block");

Derek Wang Jtuck 4 年前

此代码存在问题。

$("#selected-amounts").html("<li>&#36;"+donation+" to "+donation_cause.join("</li><li>&#36;")).css("display", "block");

目前, donation donation_cause 数组值是这样吗 "<li>$"+donation 具有相同的含义 "<li>$"+donation.toString()

添加 <li> 每个项目的标签 捐赠

let htmlCode = "";
for (let i = 0; i < donation.length; i ++) {
  htmlCode += "<li>&#36;" + donation[i] + " to " + donation_cause[i] + "</li>";
}
$("#selected-amounts").html(htmlCode).css("display", "block");

推荐文章

Softly · 单选按钮未按预期取值

1 年前

Jason Owens · 我的html/javascript播放按钮无法播放嵌入的youtube视频

1 年前