Why does .off() work from the browser console but not from within the code?

Vote count:

0

I want to remove an event handler using .off() .

When I try it from within the code it doesn't work. But when I try it from the browsers console it does.

Here's my code:

<script>
  jQuery(function($) {
    ajaxifyShopify.init({
      method: '{{ settings.ajax_cart_method }}',
      wrapperClass: 'wrapper',
      formSelector: '#addToCartForm',
      addToCartSelector: '#addToCart',
      cartCountSelector: '#cartCount',
      toggleCartButton: '.cart-toggle',
      useCartTemplate: true,
      btnClass: 'btn',
      moneyFormat: {{ shop.money_format | json }},
      disableAjaxCart: false,
      enableQtySelectors: true
    });
  });

  console.log('ajaxifyShopify initialized for the first time');

  var ias = jQuery.ias({
    container:  '#products',
    item:       '.single-product',
    pagination: '.pagination-custom',
    next:       '.next'
  });

  ias.on('rendered', function(data, items) {
    console.log('ias rendered event');

    // Unbind #addToCartForm
    $("#addToCartForm").off(); // <<<<<<<<<<<<
    console.log('ajaxifyShopify off from ias rendered event');

    // Initialize ajaxifyShopify
    jQuery(function($) {
        ajaxifyShopify.init({
          method: '{{ settings.ajax_cart_method }}',
          wrapperClass: 'wrapper',
          formSelector: '#addToCartForm',
          addToCartSelector: '#addToCart',
          cartCountSelector: '#cartCount',
          toggleCartButton: '.cart-toggle',
          useCartTemplate: true,
          btnClass: 'btn',
          moneyFormat: {{ shop.money_format | json }},
          disableAjaxCart: false,
          enableQtySelectors: true
        });

      console.log('ajaxifyShopify initialized from ias rendered event');
    });
  })
  </script>

The unbinding doesn't work. But when I run $("#addToCartForm").off(); from within the browser console on the page, it does.

What's causing this and how do I solve it?

asked 15 secs ago

narzero

386

Why does .off() work from the browser console but not from within the code?