javascript - 隐藏一个 div 而不指定 id 或 class

Question

我一直在搜索这样的问题，但找不到。

我的结构看起来像这样:

<div id="productholder@(item.ProductId)" class="productholder">  
  <img src="@Html.DisplayFor(modelItem => item.Image)" alt="" />
  <div class="productinfo">
    <h2>@Html.DisplayFor(modelItem => item.Name)</h2>
    <p>@Html.DisplayFor(modelItem=> item.Description)</p>
    <br />   
  </div>
  <div class="productprice">     
    <h2>@Html.DisplayFor(modelItem => item.price):-</h2>          
    <input type="button" value="Ta bort" class="b" data-ProductImageId='@item.ProductImageId'>                          
  </div>                                   
</div>

我想要做的是，当有人点击具有 class="b" 的按钮时，整个 div 标签应该被隐藏起来 .hide()问题是我有 10 个看起来相同的 div 标签，所以我不能指定 div 标签，因为重要的是只隐藏我单击的按钮内的 div 标签。

我想我需要使用 parent 或类似的东西？

我尝试了以下 jquery 脚本:

<script type="text/javascript">
    $(document).ready(function () {
        $(".b").click(function () {
            $("div:eq(0)").hide();
        });
    });
</script>

但我发现它不会工作，因为它会隐藏整个 div 包装器。

欢迎任何类型的解决方案!

Answer 1

    $(".b").click(function () {
        $(this).parent().hide();
    });

或

    $(".b").click(function () {
        $(this).parent().parent().hide();
    });