javascript - jQuery - 引用附近的元素

Question

当“产品输入”的值发生变化时，我希望更新“产品总计”。我的事件正在运行，但我似乎无法引用“产品总计”。

这是 HTML:

<div class='product'>
    <h2>Photo Prints up to 5” x 7”</h2>
    <div class='product-total'></div>
        <div class='choices'>
        <input type='text' class='raw standard product-input'  />
    </div> <!-- END Choices -->

    Standard: <input type='radio' class='quality standard' value='standard' />
    Full: <input type='radio' class='quality full' value='full' />

</div> <!-- END Product -->

还有 jQuery:

jQuery('input.product-input').change(function() {
        jQuery('div.product-total', jQuery(this).parent('div.product')).html(total);

    });

Answer 1

替换:

jQuery(this).parent('div.product')

与:

jQuery(this).closest('div.product')

• parent 仅向上一级。
• closest 向上查找，直到找到第一个匹配项。

完整代码:

jQuery(this).closest('div.product').find('div.product-total').html(total);

find 比上下文选择器更好，因为实际上 find 是上下文选择器使用的，因此您可以首先使用它并保存该行程。