运行部分功能的锚标记上的onclick事件

Question

Belwo is my function which i want to execute on click event of anchor tag. I have tried two methods but none of them working completely fine.

1st way:

<a href="/" id="btn_shopping" onClick="logContinueShopping();">Continue Shopping</a>

In this way my function is not working unless i put event.PreventDefault() within my function. But as i put event.PreventDefault() in my logContinueShopping() function, the function works fine but anchor tag is not working as obvious.

2nd way:

<a href="#" id="btn_shopping" onClick="logContinueShopping(); document.location='/'">Continue Shopping</a>

In this way, my function is running till ajax request but the success function is not executing ie it is not setting the cookie and redirection the page to '/'.

 function logContinueShopping(){
            var action = 'continue_shopping';
            // Check if the activity is already logged
            var checkCookie = getCookie('continue_shopping');
            if(checkCookie == ''){
                $.ajax({
                    type: 'POST',
                    url:  '/ajaxCall/user-activity-ajax.php',
                    data: {
                        action:action,
                        url:url
                    },
                    success: function(response)
                    {
                        document.cookie = "continue_shopping  = " + action + "; path=/";
                    }
                });
            }

I would request to please not to provide jQuery solution as im forced to use javascript here.

Thanks alot. }

Answer 1

Have you thought about setting the document.location in your success handler? :

$.ajax({
    type: 'POST',
    url: '/ajaxCall/user-activity-ajax.php',
    data: {
        action: action,
        url: url
    },
    success: function (response) {
        document.cookie = "continue_shopping  = " + action + "; path=/";
        document.location = '/';
    }
});

Answer 2

Try this: change href="javascript:void(0)"

and user window.location="/" on success of the ajax call to redirect.

Answer 3

I have placed async: false and used the function in below way

<a href="javascript:void(0)" id="btn_shopping" onClick="logContinueShopping(); window.location='/'">Continue Shopping</a>

Thanks for contribution.