How can I prevent popup blocking after ajax call?

Question

I'm working on a JS project where I need for some popups, the problem is that when the popup is being made after an ajax call then the browser will block it but if I make it directly when the user clicking it's working well.

The browser will block this:

$.ajax({
    url: url
}).done(function(data) {
    showPopup();
});

While the browser will let this:

$('#but').click(function(evt) {
    showPopup();
});

The code on Plunker

Answer 1

in browser block popup

please test

$('#ajax_but').click(function() {
  $.ajax({
    async: false,
    url: 'data.json'
  }).done(function() {
    popup();
  });
});

or link