Question

我的团队正在开发一个Web应用程序以显示个人财务状况。我们希望用户将他们的支出添加到匹配的类别中（例如，食品的费用为50美元），然后输入这些费用。然后，我们想获取所有食物条目的总和并显示出来。因此，我们需要以某种方式将这些lis排列成阵列-这就是我的想法。并且以某种方式还没有出现的新lis必须具有一些特殊的id（？），以便它们彼此“查找”（意思是，所有食物值都进入食物数组）？有没有办法用React做到这一点？

我不确定以后如何集成React以及如何形成数组以对值求和（此处为“ wert”）。

Kategoriehinzufügen：添加类别
Zahlenwerthinzufügen：增值
下拉菜单：您可以在其中选择类别
wert：在其中插入花费的值
eingabeNum：insertNum
eingabeText：insertText

function grab(event) {
    if (event.which === 13) {
        var eingabeNum = $("#wert").val();
        var eingabeText = $("#dropdown").val();
        if (eingabeNum == "" || eingabeText == "") {
            alert("Bitte alle spalten ausfüllen!");
        } else {
            $("#wert").val("");
            $("#dropdown").val("Kategorie");
            $("ul").append("<li><span class='trash'><i class='fa fa- 
                trash '></i></span> " + eingabeText + "<span 
                class = 'betrag' > " + eingabeNum + "€ < /span></li > ")
        }
    }
}

Answer 1

看起来好像您在使用React（您正在用jQuery追加新元素）。因此，如果您仅使用DOM元素，则可以在每个元素<li class="food">..</li>上包含一个CSS类。然后，您可以轻松$("li.food")选择它们。

您还需要元素的值。您可以从li导航到包含该值的span，然后从那里获取它，但是它变得非常混乱。将item值作为HTML属性包含可能更干净：

$("ul").append("<li class='food' itemValue='" + eingabeNum + "'><span class='trash'><i class='fa fa- 
            trash '></i></span> " + eingabeText + "<span 
            class = 'betrag' > " + eingabeNum + "€ < /span></li > ")

那么您可以轻松地从<li>上获取它。

let sum = 0;
$("li.food").each(function() {
    sum += $(this).attr("itemValue");
});
console.log("Sum of food items: " + sum);

在数组中创建一个新的lis，然后求和它们的值

1 个答案: