我有以下标记:
<table>
<tr>
<td>2 <i class="increase_quantity hidden-print icon-plus-sign"></i> <i class="decrease_quantity hidden-print icon-minus-sign"></i></td>
<td class="price_setup">0.0</td>
</tr>
</table>
jQuery
$(document).on('click', '.increase_quantity', function() {
alert('Setup Price: ' + $(this).closest('td').siblings('td.price_setup').text());
return false;
});
问题是结果是空白的。我实际上是在尝试,parseFloat
但一直在NaN
这样做,所以现在才把它拿出来。
更新
tr
正在通过 ajax 请求附加到表中
// ajax callback
// append result of ajax request
$('#line_items tbody:last').append(data);
小提琴: http: //jsfiddle.net/f49V8/11/(有效)
Ajax 响应是包含上述标记的有效 HTML。
编辑 - 完整代码
我已经用一把细齿梳子完成了这个,老实说看不出有什么问题,所以要发布完整的相关代码,希望有人发现一些东西。
导轨
class PriceListItemController < ApplicationController
def get_info
if params[:id] != ''
product = PriceListItem.find_by_id(params[:id])
total = product.price_setup + (product.price_rental * product.contract_length)
next_item = params[:no_items].to_i + 1
output = '<tr><td>' + next_item.to_s + '</td><td>' + product.product_type + '</td><td>' + product.description + '</td><td>1 <i class="increase_quantity hidden-print icon-plus-sign"></i></td><td class="price_setup">' + product.price_setup.to_s + '</td><td class="price_rental">' + product.price_rental.to_s + '</td><td class="contract_length">' + product.contract_length.to_s + ' months</td><td class="total">' + total.to_s + '</td></tr>'
render :text => output
end
end
end
HTML
<div class="row-fluid">
<table id="line_items" class="table table-striped table-hover">
<thead>
<tr>
<th>#</th>
<th>Item</th>
<th>Description</th>
<th>Quantity</th>
<th>Setup Cost</th>
<th>Rental Cost</th>
<th>Contract Term</th>
<th>Total</th>
</tr>
</thead>
<tbody>
<tr id="blank">
<td>-</td>
<td>-</td>
<td>-</td>
<td>-</td>
<td>-</td>
<td>-</td>
<td>-</td>
<td>-</td>
</tr>
</tbody>
</table>
</div>
jQuery
var no_items = 0;
$('#add_product').click(function() {
$.ajax({
url: '/price_list_item/get_info',
data: { id: $('#products_list').val(), no_items: no_items },
dataType: 'html',
type: "GET",
cache: false,
success: function(data) {
no_items++;
// append result of ajax request
$('#line_items tbody:last').append(data);
// remove blank row
$('#blank').remove();
var sub_total = 0;
var vat;
// update totals
$('.total').each(function(i) {
sub_total += parseFloat($(this).text());
});
vat = sub_total * 0.2;
total = vat + sub_total;
$('#sub_total').text('£' + sub_total);
$('#vat').text('£' + vat);
$('#total').text('£' + total);
},
error: function(){
alert('An error occurred, please refresh the page and try again');
}
});
});
$(document).on('click', '.increase_quantity', function() {
var quantity = parseInt($(this).parent().text());
var new_quantity = quantity + 1;
if (new_quantity > 1) {
$(this).closest('td').html(new_quantity + ' <i class="increase_quantity hidden-print icon-plus-sign"></i> <i class="decrease_quantity hidden-print icon-minus-sign"></i>');
// readjust total for this line item
var setup_cost = parseFloat($(this).closest('td').siblings('td.price_setup').text());
var rental_cost = parseFloat($(this).closest('td').siblings('td.price_rental').text());
var contract_length = parseInt($(this).closest('td').siblings('td.contract_length').text());
alert(setup_cost);
var total = setup_cost + (rental_cost * contract_length);
$(this).parent().parent().children('.total').text(total);
// update totals
$('.total').each(function(i) {
sub_total += parseFloat($(this).text());
});
vat = sub_total * 0.2;
total = vat + sub_total;
$('#sub_total').text('£' + sub_total);
$('#vat').text('£' + vat);
$('#total').text('£' + total);
}
return false;
});