Question

我正在尝试构建一个从四个不同的复选框调用的通用函数。选中该复选框后，应从复选框附近的按钮中删除禁用的属性。

我的按钮都有像这样的不同类

按钮1：class="button primary pie list-buy-button list_buy_button_1903"

按钮2：class="button primary pie list-buy-button list_buy_button_1901"

按钮3：class="button primary pie list-buy-button list_buy_button_1899"

按钮4：class="button primary pie list-buy-button list_buy_button_1897"

首先我将事件绑定到我的复选框

$(".avtalsbox").each(function()
{
    $(this).click(function()
    { 
      chbclickeventhandler(this);
    });
});

然后我用这个函数处理它..这是我遇到问题的地方

我尝试了很多解决方案，但没有人工作？

function chbclickeventhandler(thebox)
{

    if (thebox.checked) {

    //SOLUTION 1
    var button = $(thebox).closest("[class*='buy_button']");    
    $(button).removeAttr("disabled");

    //SOLUTION 2
    var button = $(thebox).parent().children("[class*='buy_button']");    
    $(button ).removeAttr("disabled"); 
    }
}

这就是我的html的样子

<div class="buyonly boxhighlight varmepaket1">
<div width="100%" style="float:right;"> 
<!---köpknapp--->
<form class="product_form" action="/shoppingcart/increase_product_count/" method="post">
  <input type="hidden" name="quantity" value="1" id="quantity">
  <span class="button-container pie">
  <!-- THIS IS THE INPUT I WANT TO REMOVE DISABLED FROM ASWELL AS ADD IT -->
    <input class="button primary  pie list-buy-button list_buy_button_1903" type="submit" value="Beställ idag!" disabled="">     
  </span>
  <!---crap--->
  <input type="hidden" name="product_id" value="1903">
  <input type="hidden" name="article_number" value="varmepaket2">      
</form>
<!---köpknapp END---> 
</div>

<div width="" style="float:right;">
<a href="#" onclick="eb_klarna_sum=14990; $('body').find('#klarna_payment').click(); return false;">
  <img class="symbol" src="/layouts/focus/klarna_symbol.png"> Dela upp betalningen från xxx  kr/mån</a></div>

 <div style="float:left;"><input type="checkbox" class="avtalsbox" name="godkannavtalet" value="varmepaket1">Jag godkänner avtalet!</div>
</div>

Answer 1

您对closest的使用不正确请尝试这种方式：如果选择器中存在匹配项，则最近只会将您转到父级或自身。所以这里使用closest来获取类.buyonly的父div并找到其中的按钮。

$(".avtalsbox").change(chbclickeventhandler);

function chbclickeventhandler() {
    if (this.checked) {
    //SOLUTION 1
        var button = $(this).closest(".buyonly").find("[class*='buy_button']");
        $(button).prop("disabled", false);
    }
}

<强> Fiddle

如果您想要切换按钮，那么您可以这样做：

$(".avtalsbox").change(chbclickeventhandler);

function chbclickeventhandler() {
    $(this)
        .closest(".buyonly")
        .find("[class*='buy_button']")
        .prop("disabled", !this.checked);

}

Answer 2

在您的情况下，复选框不是按钮的子项，因此您不能使用最接近的！

Answer 3

使用

 $(thebox).closest('.product_form').find(["class*='buy_button']");

Jquery最近不起作用？

3 个答案: