使用jQuery循环遍历具有相同类的动态创建的元素

8 浏览
0 Comments

使用jQuery循环遍历具有相同类的动态创建的元素

我有一些在按钮点击时动态创建的div。\n

\n在按钮点击时，会创建一些带有Amount值的div。\n

funtion createDiv(){
  $("#ProductDetail").append(""+Amount+"");
}

\n我想循环遍历这些动态创建的div，以获取jquery中的Amount值。我尝试了下面的代码。但它没有循环迭代。\n

function calculateAmount(){
    $('.Amount').each(function (i, obj) {
         TotalAmountValue=TotalAmountValue+$(this).html();
    });
}

\n请有人帮助我。

0

3 答案

0 Comments

问题的原因：这个问题的原因是要在jQuery中循环遍历通过动态创建的具有相同类的元素。

解决方法：要解决这个问题，可以使用jQuery的each()函数来循环遍历具有相同类的元素。

代码示例：

$('.Amount').each(function(index, val) {
    // 在这里执行操作
});

这段代码会选择所有具有"Amount"类的元素，并对它们进行循环遍历。在循环的每一次迭代中，回调函数会被调用，并传递当前元素的索引和值作为参数。在回调函数中，你可以执行任何你想要的操作。

使用这种方法，你可以很容易地在jQuery中循环遍历动态创建的具有相同类的元素。无论你创建了多少个具有相同类的元素，这个方法都能有效地循环遍历它们，并让你对每个元素执行自定义的操作。

0
0 Comments

问题出现的原因：

在使用jQuery循环遍历动态创建的具有相同类名的元素时，可能会遇到一些问题。由于动态创建的元素在页面加载时可能还不存在，因此无法通过普通的选择器直接获取它们。这导致在循环遍历时无法正确地获取和处理这些元素。

解决方法：

为了解决这个问题，可以使用事件委托的方式，将事件绑定到静态的父元素上，并通过事件冒泡的机制来处理动态创建的元素。具体的解决方法如下所示：

// 通过事件委托绑定事件到父元素
$(document).on('click', '.Amount', function() {
  // 处理代码
});

通过这种方式，无论何时动态创建了具有类名为"Amount"的元素，都可以通过父元素来处理它们的点击事件。

另外，如果需要在循环遍历动态创建的元素时获取它们的文本内容，可以使用jQuery的text()方法。这个方法可以获取元素的文本内容，并且可以在循环遍历时使用。具体的代码如下所示：

var TotalAmountValue = 0;
$('.Amount').each(function (i, obj) {
  TotalAmountValue += parseInt($(this).text());
});

通过上述代码，可以将动态创建的元素的文本内容进行累加，并将结果存储在TotalAmountValue变量中。在循环遍历过程中，可以通过$(this).text()来获取每个元素的文本内容，并进行相应的处理。

通过以上的解决方法，可以实现在jQuery中循环遍历动态创建的具有相同类名的元素，并对它们进行相应的操作。

0
0 Comments

问题的原因是在动态创建的元素上循环时，无法正确地获取元素的值。解决方法是使用jQuery的`.each()`方法来遍历所有具有相同类名的元素，并使用`.text()`方法来获取元素的文本值。然后将文本值解析为整数，进行累加操作。

以下是解决问题的代码示例：

$(document).ready(function(){
    $("#ProductDetail").append("
3
");
    $("#ProductDetail").append("
3
");
    $("#ProductDetail").append("
3
");
    $("#sum").click(function() {
        var sum = 0;
        $(".Amount").each(function() {
            sum += parseInt($(this).text());
        });
        alert(sum);
    });
});

上述代码中，通过在`#ProductDetail`中动态创建了三个具有相同类名`Amount`的`div`元素。当点击`#sum`按钮时，会遍历所有具有类名`Amount`的元素，将其文本值解析为整数并累加到`sum`变量中，最后通过`alert()`方法显示出结果。

HTML部分如下：

以上是解决该问题的完整代码，你可以将其复制粘贴到你的HTML文件中进行测试。

0