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();
            }
        });
    });

修改

我还遇到的另一个问题是，如果我将链接存储到变量中，然后打开一个新窗口，window.location = href;大多数浏览器都会阻止它，用户必须手动接受目标站点的弹出窗口，再次对用户体验不利。

Answer 1

你不能像你说的那样使用preventDefault来实现这一点 - 因为异步。我会尝试的是：

preventDefault

将href存储为变量

调用ajax

如果为true，则重定向到href变量，如果为false，则重定向到<{1}}

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>

的定期点击

根据Ajax响应阻止链接的默认

1 个答案: