Question

在子主题的custom.js中，我有以下内容：

$(document.body).on('added_to_cart', function() {
    console.log('Product Added');
});

理论上，当产品成功添加到购物车后，这应该在控制台中输出该消息。但是，此刻什么也不做，我无法弄清楚为什么？

Answer 1

这对我来说似乎很好...

HTML（带有Bootstrap 4）

<div class="container mt-5">
  <div class="col-4 mx-auto">
    <div class="card">
      <div class="card-body text-center">
        <h5>Hello, World!</h5>
        <br>
        <button id="addToCart" class="btn btn-primary">
          Trigger Event
        </button>
      </div>
    </div>
  </div>
</div>

JS

var body = $(document.body);
var button = $('#addToCart');

body.on('add_to_cart', function (event) {
  console.log('added to cart!');
});

button.on('click', function () {
  body.trigger('add_to_cart');
})

您可以签出此CodePen并试用它：
https://codepen.io/anon/pen/ZjBoNY?editors=1010

Answer 2

jQuery(document).ready(function($){
    $('body').on( 'added_to_cart', function(){
        alert("testing!");
    });
});

使用它对我有用..：）

将产品成功添加到购物车后，触发JQuery脚本

2 个答案: