在链接单击事件上返回true是't工作

Returning true on Link Click Event isn't working

本文关键字:工作 true 单击 链接 事件 返回      更新时间:2023-09-26

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

更新为了更清楚一点,我同意这通常不是一个最佳解决方案,但我正在使用谷歌的标签管理器来监控电子商务流量。我正在努力确保产品点击被推送到他们的dataLayer,并使用他们的事件回调来恢复正常行为。更多信息请点击此处:https://developers.google.com/tag-manager/enhanced-ecommerce#product-点击

这是我根据下面的答案更新的方法,但仍然不起作用。

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

它做得不太好,但这应该有效:

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

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

根据@msomethinghere的答案,您的代码可以进一步简化以提高可读性:

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

好的,伙计们,谢谢你们帮我到达那里。通常情况下,所有其他答案都很好,但对于这个特定的标记管理器实例(出于某种未知原因),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');
     }
}