Question

我正在尝试执行一些在单击特定链接时具有回调的代码。回调是再次单击链接，但在第二次传递时，该方法返回true以遵循正常行为。但由于某种原因，它不起作用？我使用clickedLink来获得适当的范围。在事件回调中，this指的是window。

更新为了更加清晰，我通常认为这不是一个最佳解决方案，但我使用Google的跟踪管理器来监控电子商务流量。我正在尝试确保将产品点击推送到他们的dataLayer，并使用他们的事件回调来恢复正常行为。更多信息：https://developers.google.com/tag-manager/enhanced-ecommerce#product-clicks

这是我根据以下答案更新的方法，但它仍然无效。

var shopCartBtnClicked = false;
var clickedLink;
jQuery('#pdp_add_cart, .add_to_cart_button').click(function(e) {

    if (shopCartBtnClicked === true) {
        shopCartBtnClicked = false; //I make it here just fine
    } else {
        e.preventDefault();
        clickedLink = this;
        var pdp = false;
        if (mmProduct) {
            //On detail page
            mmProduct.qty = jQuery('input[name="quantity"]').val();
            pdp = true;
        } else {
            //on a shopping page
            mmProduct = findProductClicked(this);
            mmProduct.qty = 1;
        }

        dataLayer.push({
            'event': 'addToCart',
            'ecommerce': {
                'currencyCode': 'USD',
                'add': {
                    'products': [{
                        'name': mmProduct.name,
                        'id': mmProduct.id,
                        'price': mmProduct.price,
                        'quantity': mmProduct.qty
                    }]
                }
            },
            'eventCallback': function () {
                //Are we on a product detail page with a form, or just a shopping page with a link?
                if (pdp) {
                    jQuery('form.cart').submit(); //This part works just fine
                } else {
                    mmProduct = null;
                    shopCartBtnClicked = true;
                    $(clickedLink).trigger('click'); //This doesn't
                }
            }
        });
    }
});

Answer 1

做得不好，但这应该有效：

var shopCartBtnClicked = false;
var clickedLink;
jQuery('.add_to_cart_button').click(function(e) {
    if (shopCartBtnClicked === true) {
        shopCartBtnClicked = false;
        // dont return, just let javascript handle this one
    } else {
        // only execute when you have not set it to true
        e.preventDefault();
        clickedLink = this;

        shopCartBtnClicked = true;
        $(clickedLink).trigger('click');
    }
});

我不得不想知道你为什么不首先执行你的其他逻辑然后 而不是阻止默认。

Answer 2

采用@ somethinghere的答案，您的代码可以进一步简化以提高可读性：

var shopCartBtnClicked = false;
jQuery('.add_to_cart_button').click(function(e) {
    if( shopCartBtnClicked ) {
        shopCartBtnClicked = false;
        // dont return, just let javascript handle this one
    } else {
        // only execute when you have set it to true
        e.preventDefault();

        shopCartBtnClicked = true;
        this.click();
    }
});

或者，正如@Regent所建议的那样：

var shopCartBtnClicked = false;
jQuery('.add_to_cart_button').click(function(e) {
    shopCartBtnClicked = !shopCartBtnClicked;
    if( shopCartBtnClicked ) {
        e.preventDefault();
        this.click();
    }
});

Answer 3

好的伙计们，谢谢你们帮助我到达那里。通常，所有其他答案都可以很好地工作，但对于这个特定的标记管理器实例，它出现（由于某些未知的原因），document.location在事件回调中工作正常。这很有效。

这很奇怪，因为我在代码前面的回调中使用了$(this).('form.cart').submit();。

'eventCallback': function () {
     //Are we on a product detail page with a form, or just a shopping page with a link?
     if (pdp) {
        jQuery('form.cart').submit();
     } else {
        mmProduct = null;
        document.location = $(clickedLink).attr('href');
        //$(clickedLink).trigger('click');
     }
}

在Link Click Event上返回true是不行的

3 个答案: