Javascript 隐藏/关闭由.show（）打开的div

当我的页面加载时，我使用

$('#popupPerson').hide();

然后在正文中，我构建了一个表和这个弹出窗口，以帮助使用初始隐藏的表单插入/更新/删除行数据

<div id="popupPerson" class="popupPerson">
  <form id="form_popup_person" action="person_update" method="post">
    <fieldset>
      <legend>Person</legend>
      <label for="id">id</label>&nbsp;<input name="id" type="number" />&nbsp;&nbsp;
      <label for="revision">revision</label>&nbsp;<input name="revision" type="number" /><p>
      <label for="lastName">lastName</label>&nbsp;<input name="lastName" type="text" />&nbsp;&nbsp;
      <label for="firstName">firstName</label>&nbsp;<input name="firstName" type="text" /><p>
      <label for="street">street</label>&nbsp;<input name="street" type="text" />&nbsp;&nbsp;
      <label for="city">city</label>&nbsp;<input name="city" type="text" /><p>
      <label for="county">county</label>&nbsp;<input name="county" type="text" />&nbsp;&nbsp;
      <label for="state">state</label>&nbsp;<input name="state" type="text" />&nbsp;&nbsp;  
      <label for="postalCode">postalCode</label>&nbsp;<input name="postalCode" type="text" /><p>  
      <label for="birthDate">birthDate</label>&nbsp;<input name="birthDate" type="text" />&nbsp;&nbsp;  
      <label for="email">email</label>&nbsp;<input name="email" type="text" />&nbsp;&nbsp;       
      <label for="status">status</label>&nbsp;<input name="status" type="text" /><p> 
      <input name="submit" type="submit" value="Submit" />
      <input name="cancel" type="submit" class="cancel" value="Cancel" />
      <button type="button" class="cancel" onClick="this.parent.close();">Cancel button</button>
      <button type="button" class="cancel" onClick="$(this).parent().parent().hide();">parent parent hide button</button>
      <button type="button" class="cancel" onClick="$(this).parent().hide();">parent hide button</button>  <!-- makes ALL BUTTONS DISAPPEAR -->
      <button type="button" class="cancel" onClick="$(this).hide();">hide button</button>         <!-- makes the BUTTON ITSELF DISAPPEAR -->       
    </fieldset>
  </form>
</div>

---

我想在表单中添加一个“取消”按钮，该按钮只需关闭/隐藏div即可-无需提交，无需重置。

您只需像这样编写即可

 <button type="button" class="cancel" onClick="$('#popupPerson').hide();">Cancel</button>

我会使用这个：parent-hide按钮来关闭containing.popuperson，以防在一个页面上需要多个

或者，您可以将其放入脚本中：

$(function(){
  $(document).on('click','.popupPerson .cancel', function(){
    $(this).closest('.popupPerson').hide();
    // Do whatever else you want here, like eat the event (stopPropegation, etc).
  });
});

这就是要素：

<a class="cancel">parent parent hide button</a>

为什么不能使用$'popuperson'。隐藏在onclick中？

<a class="cancel">parent parent hide button</a>