选择最近的类并使用jQuery删除它

Selecting closest class and removing it with jQuery

本文关键字:jQuery 删除 最近 选择      更新时间:2023-09-26

当用户点击"编辑"我怎么能找到最接近的row_form和删除它与jquery?
这是我到目前为止所做的尝试。

<div id="settings_wrapper">
        <h1>General settings</h1>
        <div class="settings_row">
          <span class="row_name">Name</span>
          <div class="row_edit"><p class="row_edit_button">Edit</p></div>
          <div class="row_form">
            <form action="this.php"><span>New name:</span><input type="text" /><input type="submit" value="Save"><span>New name:</span><input type="text" /></form>
          </div>
        </div>
        <div class="settings_row">
          <span class="row_name">Name</span>
          <div class="row_edit"><p class="row_edit_button">Edit</p></div>
          <div class="row_form">
            <form action="this.php"><span>New name:</span><input type="text" /><input type="submit" value="Save"><span>New name:</span><input type="text" /></form>
          </div>
        </div>
      </div>  
JQUERY

 $(document).ready(function(){
      $(".row_edit_button").click(function(){
         $(this).closest(".row_form").remove(); 
      });
});

目标元素是被单击元素的parentNode的下一个兄弟元素。closest选择最接近匹配的元素。一个选项是:

$(".row_edit_button").click(function() {
   $(this.parentNode).siblings(".row_form").remove(); 
});

其他选项为:

$(this).parent().next(".row_form").remove();
$(this).closest('.settings_row').find(".row_form").remove();