Override woocommerce ajax add to cart in child theme

1/ In the functions.php file of the child theme, include a JavaScript file by using the wp_enqueue_script hook. This is one of the most popular hooks that WordPress offers to customize websites. Let’s have a look at the script that includes the ajax_add_to_cart.js file below:

function ql_woocommerce_ajax_add_to_cart_js() {
    if (function_exists(‘is_product’) && is_product()) {  
       wp_enqueue_script(‘custom_script’, get_bloginfo(‘stylesheet_directory’) . ‘/js/ajax_add_to_cart.js’, array(‘jquery’),’1.0′ );
    }
}
add_action(‘wp_enqueue_scripts’, ‘ql_woocommerce_ajax_add_to_cart_js’);

2/ Create a JS file in the child theme
3/ The JQuery/JS file

The next step is to work on the JQuery file that you’ve uploaded in your child theme. That file is empty so you need to add scripts. First, prevent the add to cart button from reloading the page with the following script:

$(‘.single_add_to_cart_button’).on(‘click’, function(e) { 
    e.preventDefault();
});