Ending any connection after "closing" the link

Question

I’m using a small ajax code to open some links! Only sometimes these links have some videos!! And even that loads!! But the problem is that these links are opened in a lightbox! And when you close the lightbox the video keeps running!! Which sucks! Because actually only closes the lightbox! It does not "close" the link!

How do you perform this link "shutdown" once you close the lightbox?

Script by Lightbox

$(document).ready(function() {
  $('.lightbox').click(function(){
      $('.background, .box').animate({'opacity':'.9'}, 1, 'linear');
      $('.box').animate({'opacity':'1.00'}, 1, 'linear');
          $('.background, .box').css('display','block');
   }); 

   $('.close').click(function(){
          $('.background, .box').animate({'opacity':'0'}, 1, 'linear', function(){
              $('.background, .box').css('display','none'); 
          });
    });
});

Ajax code

  //Carregamento AJAX
  function pag(brl)
      {   
      var url = eval("brl");
      $( "#content" ).load(url, function(e) {
          e.preventDefault()
  });
      }

The Link Is Like:::

<a class="home lightbox" href="#!" onclick="pag('urlaseraerta.php');">link</a>

Answer 1

To figure out how to fix it you have to understand what happens when you do it click link and run the function pag('urlaseraerta.php').

The method $( "#content" ).load jQuery will fetch HTML from url you passed as the function argument and insert this HTML into the element you used in the selector in which you used the method .load().

When you click to remove the link, what you are doing is hiding the element, changing only its visibility. That is, the content is still there, only without being visible to the user.

What you need to do is empty that div for the content to disappear from the DOM. To do this just join .html(''); replacing the contents with an empty string.

$('.close').click(function(){
      $('.background, .box').animate({'opacity':'0'}, 1, 'linear', function(){
          $('.background, .box').css('display','none').html('');
          //                                          ^   ^   ^ - juntei aqui o que faltava
      });
});