Jquery最接近不起作用

Jquery closest does not work?

本文关键字：不起作用 最接近 Jquery      更新时间：2023-09-26

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

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

按钮 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>

您对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);
    }
}

小提琴

如果您想切换按钮，那么您可以执行以下操作：

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

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

使用 

 $(thebox).closest('.product_form').find(["class*='buy_button']");
相关文章：