在jQuery的.closest（）中使用类名称 [英] Using a class name in jQuery's .closest()

问题描述

我试图对运行总计进行一些计算，这是我的代码：

  $ .quantity_input'）。live（'change'，function（）{
 var ValOne = parseFloat（$（this）.val（））; 
 var ValTwo = parseFloat .text（））
 var totalTotal =（（ValOne）*（ValTwo））; 
 $（'cost_of_items'）。closest（'。cost_of_items'）text（totalTotal.toFixed ）; 
 calcTotal（）; 
}）; 
 

.quantity_input是一个输入，.price是产品的价格，.cost_of_items是我想要的以更新项目的总成本，即。 item1 =£5 x 3 quantity =£15 total for item1
calcTotal（）是一个只更新订单总成本的函数。问题是保持所有的数学在表的一行，即我在上面的代码执行计算，它不坚持其行，更新所有字段与类.cost_of_items等...

显示我的html的问题是它的动态添加jQuery .appends（），但这里是相关的jQuery：

  $（'＃items'）。append（'< tr class =tableRow>< td>< a class =removeItemhref =＃> ; img src =/ admin / images / delete.png>< / img>< / a>< td class =om_part_no>'+ omPartNo +'< / td>< td& '+ supPartNo +'< / td>< td>'+ cat +'< / td>< td class =description>'+ desc +'< / td>< td& manuf +'< / td>< td>'+ list +'< / td>< td>'+ disc +'< / td>< td>< p class =add_edit>添加/编辑< / p>< input type =textclass =quantity_inputname =quantity_input/>< / td>< td class =price_each_nett price>'+ priceEach +'< ; / td>< td class =cost_of_items>< / td>< td>< p class =add_edit> Add / Edit< / p>< input type =textclass = project_ref_inputname =project_ref_input/>< p class =project_ref>< / p>< / td>< / tr>'） 
  

编辑：

工作解决方案： / p>

  $（'quantity_input'）。live（'change'，function（）{
 var ValOne = parseFloat $（this）.val（））; 
 var ValTwo = parseFloat（$（this）.closest（'tr'）。find（'。price'）。text（））
 var totalTotal = （（ValOne）*（ValTwo））; 
 $（this）.closest（'tr'）。find（'。cost_of_items'）。text（totalTotal.toFixed（2））; 
 calcTotal ）; 
}）; 
  

解决方案

您需要找到包含 的< tr> 中的.cost_of_items ：

  $（this）.closest（'tr'）。find（'。cost_of_items'）
  pre> 
I'm attempting to do some calculations for a "running total", this is my code: 
$('.quantity_input').live('change',function(){         
                var ValOne = parseFloat($(this).val());
                var ValTwo = parseFloat($(".price").text())
                var totalTotal = ((ValOne) * (ValTwo));                         
                $('.cost_of_items').closest('.cost_of_items').text(totalTotal.toFixed(2));
                calcTotal();
            });     
.quantity_input is an input, .price is the price of the product, .cost_of_items is where i want to update the total cost for the item, ie. item1 = £5 x 3 quantity = £15 total for item1
calcTotal() is a function that just updates a total cost for the order. The problem is keeping all the math in one row of the table, ie i'm doing the calc in the code above and its not sticking to its row, its updating all the fields with class .cost_of_items etc...

the problem with showing my html is that its dynamically added by jQuery .appends() but here is the relevant jQuery:
$('#items').append('<tr class="tableRow"><td><a class="removeItem" href="#"><img src="/admin/images/delete.png"></img></a><td class="om_part_no">' + omPartNo + '</td><td>' + supPartNo + '</td><td>' + cat + '</td><td class="description">' + desc + '</td><td>' + manuf + '</td><td>' + list + '</td><td>' + disc + '</td><td><p class="add_edit">Add/Edit</p><input type="text" class="quantity_input" name="quantity_input" /></td><td class="price_each_nett price">' + priceEach + '</td><td class="cost_of_items"></td><td><p class="add_edit">Add/Edit</p><input type="text" class="project_ref_input" name="project_ref_input" /><p class="project_ref"></p></td></tr>');
EDIT:

Working solution:
$('.quantity_input').live('change',function(){         
                var ValOne = parseFloat($(this).val());
                var ValTwo = parseFloat($(this).closest('tr').find('.price').text())
                var totalTotal = ((ValOne) * (ValTwo));                         
                $(this).closest('tr').find('.cost_of_items').text(totalTotal.toFixed(2));
                calcTotal();
            });     

解决方案
You need to find the .cost_of_items in the <tr> containing this:
$(this).closest('tr').find('.cost_of_items')


                        
这篇关于在jQuery的.closest（）中使用类名称的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！