JQuery弹出层，点击按钮后弹出遮罩层，有关闭按钮

可以使用JQuery的弹出层插件，比如fancybox或者layer等，以下是一个基本的实现：

HTML代码：

<button id="show-modal">点击弹出层</button>

<div id="modal-container" style="display:none;">
  <div id="modal-overlay"></div>
  <div id="modal">
    <div id="modal-content">
      <h2>这是弹出层的标题</h2>
      <p>这是弹出层的内容</p>
      <button id="close-modal">关闭</button>
    </div>
  </div>
</div>

CSS代码：

#modal-container {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}

#modal-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

#modal {
  background-color: #fff;
  padding: 20px;
  max-width: 80%;
  max-height: 80%;
  overflow-y: auto;
}

#modal-content {
  margin-bottom: 20px;
}

#close-modal {
  display: block;
  margin: 0 auto;
}

JavaScript代码：

$(function () {
  $('#show-modal').click(function () {
    $('#modal-container').fadeIn();
  });

  $('#close-modal, #modal-overlay').click(function () {
    $('#modal-container').fadeOut();
  });
});

这里使用了jQuery的fadeIn和fadeOut方法来实现弹出层的显示和隐藏，点击关闭按钮或者遮罩层也会触发隐藏。你可以根据自己的需求修改弹出层的样式和功能。