javascript - 选择最接近的类并使用 jQuery 将其删除

Question

当用户点击“编辑”时，如何找到最接近的 row_form 并使用 jquery 将其删除？
这是我到目前为止尝试过的 jsfiddle
HTML

<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(); 
      });
});

Answer 1

目标元素是被点击元素的 parentNode 的下一个兄弟节点。 closest 选择最匹配的 parent 元素。一种选择是:

$(".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();