Question

我正在排查一个新的wordpress主题。我的调查引导我了解这种情况（.js代码，简化）：

jQuery(document).ready( function($) {
     $(".thumbnail-quantity ").bind('mouseleave',function() {   
        // Get values from input box
        var new_qty = $(this).val();

        $(this).val( new_qty );
        $(this).siblings( ".button" ).attr( "data-quantity", new_qty );
    }); 
});

并且有调用它的html代码（相同的系统，两个不同的wordpress与woocommerce主题）

旧主题，它很好用：（通过“作品”，我的意思是 - 当我将鼠标移出输入名称“thumbnail-quantity”的+/-按钮时，“add_to_cart_button”上的'data-quantity'实际上会发生变化

<input name="thumbnail-quantity" class="thumbnail-quantity quantity" min="3" value="3" step="1" "="" type="number">
<a data-quantity="3" href="/?add-to-cart=678" rel="nofollow" data-product_id="678" data-product_sku="" class="button add_to_cart_button product_type_simple">add to cart</a>

新主题，仅适用于$（this）.val（new_qty）

<span class="price">
<span class="amount">0.35€</span></span>
<input name="thumbnail-quantity" class="thumbnail-quantity quantity" min="3" value="3" step="1" "="" type="number">
<div class="add-to-cart-button">
<a data-quantity="3" href="/?add-to-cart=678" rel="nofollow" data-product_id="678" class="add_to_cart_button product_type_simple button alt-button small clearfix">add to cart</a>
</div>

这个html代码在这里 - 我只看到'输入名称'缩略图数量“'的变化，但不在按钮上。

我的赌注 - 这是“兄弟姐妹”，无法找到它的“按钮兄弟”。

我应该在.js中更改什么，以便找到按钮并更改它的值？（我无法以某种方式改变主题......它太复杂了）

Answer 1

在这种情况下，

$(this).siblings( ".button" )正在寻找放置“.thumbnail-quantity”的同一级别的“.button”元素。

但是在你的新主题“.button”中，元素放在“.add-to-cart-button”div中。

将它放在div之外：

<input name="thumbnail-quantity" class="thumbnail-quantity quantity" min="3" value="3" step="1" "="" type="number">
<a data-quantity="3" href="/?add-to-cart=678" rel="nofollow" data-product_id="678" class="add_to_cart_button product_type_simple button alt-button small clearfix">add to cart</a>

或改变jQuery以查看div：

$(".add-to-cart-button").find( ".button" ).attr( "data-quantity", new_qty );

Javascript值指定兄弟

1 个答案: