preventDefault ссылки в зависимости от ответа Ajax

Question

Я создал контроллер в Magento, который проверяет наличие или отсутствие продуктов в списке. Если в списке есть товары, он вернет true иначе false.

Вот интерфейс, который вызывает вызов ajax, но я не могу изменить это как форму. Это должна быть ссылка.

<a href="[my_controller]" title="Compare Products" target="_blank" class="compare-product-link">Compare Products</a> 

Адрес ajax.

jQuery(".compare-product-link").on("click", function(e) { 
    jQuery.ajax({ 
     async : false, 
     dataType : "json", 
     url  : "/compareextra/compare/allowed", 
     success : function(data) { 
      //console.log(data); 
      if(data.isAllowed != true) { 
       e.preventDefault(); 
      } 
     } 
    }); 
}); 

У меня есть проблема в том, что async является устаревшим и не очень хорошо для пользовательского опыта, говоря, что есть много ответа там, которые добавляют задержка 3 секунды, я не хочу, что потому что то не подходит для пользователей.

Я также пробовал использовать обещание, но он работает только с async : false.

jQuery(".compare-product-link").on("click", function(e) { 
     var response = false; 
     jQuery.ajax({ 
      dataType : "json", 
      url  : "/compareextra/compare/allowed", 
      success : function(data) { 
       console.log(data); 
       if(data.isAllowed) { 
        response = true; 
       } 
      } 
     }).done(function(){ 
      console.log(response); 
      if(response != true) { 
       e.preventDefault(); 
      } 
     }); 
    }); 

EDIT

Другая проблема у меня есть, если я хранить ссылку в переменную, а затем открыть новое окно, так что window.location = href; наиболее браузер будет блокировать его и пользователям придется вручную принимать всплывающие окна от целевой сайт, что опять-таки не очень хорошо для пользователей.

Answer 1

Вы не можете этого достичь, используя preventDefault, как вы сказали, из-за асинхронного использования. то, что я хотел бы попробовать это:

preventDefault

магазин href в качестве переменной

вызова AJAX

перенаправлять href переменной, если оно истинно, а не если ложного

jQuery(".compare-product-link").on("click", function(e) { 
    var href = $(this).attr('href'); 
    e.preventDefault(); 
    jQuery.ajax({ 
     async : false, 
     dataType : "json", 
     url  : "/compareextra/compare/allowed", 
     success : function(data) { 
      //console.log(data); 
      if(data.isAllowed == true) { 
       window.location = href; 
      } 
     } 
    }); 
}); 

если вы необходимо создать действие ссылки, вы можете использовать этот код:

function triggerClick(url){ 
    $('body').append('<span id="click_me_js"><a href="'+url+'"></a></span>'); 
    $('span#click_me_js a')[0].click(); 
    $('span#click_me_js').remove(); 
} 

, который будет имитировать регулярные нажмите на <a>