Я делаю книжный магазин и хочу добавить необычный бланк заявки jQuery. Дело в том, что пользователь должен выбрать количество книги с минус и плюс кнопка и затем позволить JavaScript вычислить полную сумму для той книги.
У меня есть разметка следующим образом:
<tr>
<td><p>Book title</p></td>
<td><p><a href="#" class="bookDecrement">-</a><input type="text" class="bookQuantity disabled" disabled /><a href="#" class="bookIncrement">+</a></p></td>
<td><p><input type="text" class="bookPrice disabled" value="70" disabled /></p></td>
<td><p>=</p></td>
<td><p><input type="text" class="bookTotal disabled" disabled /></p></td>
</tr>
Как я достигаю bookPrice и bookTotal класса в этой строке с jQuery? Так как у меня есть несколько книжных заголовков, я должен только получить доступ к входу, зарегистрированному в текущей строке.
Спасибо!
Это должно сделать:
$('.bookDecrement, .bookIncrement').click(function() {
// Get the current row
var row = $(this).closest('tr');
// Determine if we're adding or removing
var increment = $(this).hasClass('bookDecrement') ? -1 : 1;
// Get the current quantity
var quantity = parseInt(row.find('.bookQuantity').val(), 10);
// Adjust the quantity
quantity += increment;
// Quantity must be at least 0
quantity = quantity < 0 ? 0 : quantity;
// Get the price
var price = parseFloat(row.find('.bookPrice').val());
// Adjust the total
row.find('.bookTotal').val(quantity * price);
// Return false to prevent the link from redirecting to '#'
return false;
});
Вы можете добраться до tr родоначальника и снова спуститься к входу внутри. Вот так:
$("a.bookIncrement").click(function() {
$(this).closest("tr").find("input.bookPrice").doSomething();
});