jQuery“ this”显然没有选择唯一实例

时间:2019-03-16 17:19:58

标签: jquery

我试图理解为什么单击“价格”输入仅适用于第一个实例。如果我添加其他实例,则它们不会产生该值。这似乎很好地说明了问题,但提示我写更多内容!

$('#add-line').click(function() {
    var lastItem = $(this).prev();
    var lastItemNumber = lastItem.attr("data-income-line");
    var nextItemNumber = parseInt(lastItemNumber) + 1;
    lastItem.clone().attr('data-income-line', nextItemNumber).insertAfter(lastItem);
});

// addition
$('.total').click(function () {
    var line = $(this).parent().parent();
    var price = line.find("input[name='price']").val();
    var quantity = line.find("input[name='quantity']").val();
    var total = parseInt(price) * parseInt(quantity);
    line.find("input[name='total']").val(total);
})
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="income-line" data-income-line="1">                            
    <div class="item-wrapper income-name">
        name<input type="text" name="item_name" />
    </div>
    <div class="item-wrapper income-price">
        price<input type="text" name="price" />
    </div>
    <div class="item-wrapper income-x">
        X
    </div>
    <div class="item-wrapper income-quantity">
        quantity<input type="text" name="quantity" class="quantity" />
    </div>
    <div class="item-wrapper income-total">
        total<input type="text" name="total" class="total"/>
    </div>        
    <div style="clear:left"></div>
</div>
<div id="add-line" class="add-line">
    add
</div>

1 个答案:

答案 0 :(得分:0)

问题在于,仅为第一个library(data.table) setDT(df2)[, Col2 := NULL][df3, Col2 := Col2, on = .(Col1)] 创建了点击处理程序。对于稍后创建的元素,您应该依赖事件委托。使用df1 <- structure(list(Col1 = c("A", "A", "B", "A", "B", "B", "C"), Col2 = c(1, 1, 4, 1, 4, 4, 7)), class = "data.frame", row.names = c(NA, -7L )) df2 <- structure(list(Col1 = c("C", "D", "C", "F", "A", "B", "B"), Col2 = c("X", "X", "X", "X", "X", "X", "X")), class = "data.frame", row.names = c(NA, -7L))

.total