Ajax 元素的 VirtueMart“添加到购物车”发送到空的购物车/结帐页面答案

【问题标题】：VirtueMart "Add to cart" of Ajax element sends to empty Cart/Checkout pageAjax 元素的 VirtueMart“添加到购物车”发送到空的购物车/结帐页面
【发布时间】：2014-02-16 09:56:36
【问题描述】：

我正在开发一个模块来使用 Ajax 分页系统加载 Virtumemart 产品。

这很简单，例如第一次加载有 4 个带有“加载更多”按钮的产品，当它被点击时，将使用无限滚动和手动触发 javascript 插件将另外 4 个产品加载到页面。

问题是添加到购物车按钮仅适用于第一个加载的产品（前 4 个加载的产品，但不适用于通过 Ajax 添加的新产品。）

我不知道“添加到购物车”系统是如何工作的，但我认为这是因为“vmprices.js”已经加载，它不会对通过 Ajax 新添加的产品生效

您能否提出一个解决方案，使添加到购物车选项适用于通过 Ajax 加载的新产品（页面不会刷新或再次加载，只有产品通过 Ajax 加载）

无限滚动中有一个回调函数我想我应该在那里添加一些代码来重新加载脚本以识别新添加的产品：

$container.infinitescroll({
navSelector  : '#page_nav',
nextSelector : '#page_nav a',
itemSelector : '.item',
debug        : false,
path:["fetcher.php?modid=93&perpage=3&page=", ""],
behavior: 'twitter',
loading: {
 finishedMsg: '<p class="msg">No more pages</p>',
img: 'loading.gif',
msgText: "<em>Loading</em>",
speed: 'slow'
 }
 },
 function( newElements ) {
 $container.iso( 'insert', $( newElements ) );  
 }

);

提前谢谢你，这是我在这里发帖的唯一选择。

【问题讨论】：

标签： jquery ajax joomla infinite-scroll virtuemart

【解决方案1】：

这可能是由于点击事件未在动态加载的 HTML 部分触发。

也就是说，当 Ajax 加载的内容在浏览器上显示 4 个产品时，它的点击事件不起作用，因为点击事件注册时间那些 HTML 部分不在文档中。

解决方案是检查使用普通jQuery click() 编写的添加到购物车按钮代码，根据您的jQuery 版本将其更改为on() 或live() 事件。

例如：

 jQuery('.addtocart').click(function(){
  //code for adding items to the cart
  });

如果您使用 jquery 1.7 或更低版本，请改为使用 live()

 jQuery('.addtocart').live('click',function(){
      //code for adding items to the cart
      });

jQuery1.7以上版本。

 jQuery('.addtocart').on('click',function(){
      //code for adding items to the cart
      });

希望它的作品..

【讨论】：