如何隐藏 bpopup jquery？

Question

如何使用按钮隐藏 bpopup jquery？我有一个 ajax 响应，如果数据 return 错误失败，将调用 bpopup。然后在我的 bpopup 里面我有一个 "Got it!" 按钮，当用户点击它时，它只会关闭 bpopup

 $.ajax({
     url: 'my_url',
     type: "POST",
     success: function(data){
         if(data.error == 'failed){
            $('#popup').bPopup({
               modalClose: false,
               opacity: 0.6,
               positionStyle: 'fixed' 
            });

            //then my bpopup has a button "Got it!"
            $('.gotit').click(function(e) {
               //Code the will hide the bpopup.
            }
         }
     }
 })

我试过$('#popup).hide();但它没有完全关闭bpopup。

顺便说一句，这是我的弹出窗口 html。

 <div id="popup" style="display: none; min-width: 350px;">
     <span class="button b-close"><span>X</span></span>
     <div class="col-lg-12">
          <p><span class="ui-icon ui-icon-alert"></span>&nbsp;&nbsp;The Code does not match the information provided.</p>
          <button class="btn btn-primary btn-sm pull-right gotit">Got it</button>
     </div>
 </div>

Answer 1

首先

if(data.error == 'failed){ 这里 ' 遗漏了所以添加它并制作它：-

if(data.error == 'failed'){

关闭弹窗有两种方式

1.Hide直接弹出

$('.gotit').click(function() {

  $(this).closest('#popup').hide();//hidepop-up directly

  // also you can use $(this).parent().parent('#popup').hide();
});

示例：-

$('.gotit').click(function() {

  $(this).closest('#popup').hide();//hidepop-up directly
  
  // also you can use $(this).parent().parent('#popup').hide();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="popup" style="display: block; min-width: 350px;"><!--changed disply:block to show you that how it will work -->
     <span class="button b-close"><span>X</span></span>
     <div class="col-lg-12">
          <p><span class="ui-icon ui-icon-alert"></span>&nbsp;&nbsp;The Code does not match the information provided.</p>
          <button class="btn btn-primary btn-sm pull-right gotit">Got it</button>
     </div>
 </div>

2.Trigger 弹出窗口的关闭按钮点击事件（如果关闭按钮代码已经编写好并且可以运行）

$('.gotit').click(function() {
  $('.b-close').click();
});

示例：-

$('.b-close').click(function() { //if your close button code is alwready written
  $('#popup').hide();
});

$('.gotit').click(function(){
  $('.b-close').click(); // trigger close button clik event
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="popup" style="display: block; min-width: 350px;"><!--changed disply:block to show you that how it will work -->
     <span class="button b-close"><span>X</span></span>
     <div class="col-lg-12">
          <p><span class="ui-icon ui-icon-alert"></span>&nbsp;&nbsp;The Code does not match the information provided.</p>
          <button class="btn btn-primary btn-sm pull-right gotit">Got it</button>
     </div>
 </div>

如何隐藏 bpopup jquery？

How to hide bpopup jquery?

javascript

jquery

bpopup