首页 > 解决方案 > 这个 jQuery 代码在它现在不起作用之前有效,为什么?

问题描述

我有这段代码可以为图像设置动画并将其移动到购物车中。它以前有效,但自从我将 PrestaShop 更新到最新版本 (1.7.7.1) 后它不再有效

这是错误:

未捕获的类型错误:imgtodrag.clone(...).offset(...).css 不是函数

是什么原因造成的?

$(document).on('click', '.btn-cart', function() {
  if ($(document).width() > 767) {
    /*console.log("animation from outside of ajax");*/
    if ($(document).scrollTop() > 90) {
      var cart = $('.cart-menu');
    } else {
      var cart = $('#_desktop_cart');
    }
    var imgtodrag = $(this).closest('.product-miniature').find(".thumbnail-container").find("img").eq(0);
    if (imgtodrag.lenght != 0) {
      var imgclone = imgtodrag.clone().offset({
        top: imgtodrag.offset().top,
        left: imgtodrag.offset().left
      }).css({
        'opacity': '0.5',
        'position': 'absolute',
        'height': '150px',
        'width': '150px',
        'z-index': '100'
      }).appendTo($('body')).animate({
        'top': cart.offset().top + 10,
        'left': cart.offset().left + 10,
        'width': 75,
        'height': 75
      }, 1000, 'easeInOutExpo');

      setTimeout(function() {
        cart.effect("shake", {
          times: 2
        }, 200);
      }, 1500);

      imgclone.animate({
        'width': 0,
        'height': 0
      }, function() {
        $(this).detach()
      });
      console.log("test2");
    }
  } else {

编辑:这部分似乎:

.offset({
            top: imgtodrag.offset().top,
            left: imgtodrag.offset().left
          })

不工作。
如果我输入随机值而不是“top:imgtodrag.offset().top”和“left:imgtodrag.offset().left”,
我验证我是否可以从 imgtodrag 获取值,是的,我可以,
所以看起来我的 imgtodrag.clone() 不能与偏移功能一起使用,我不明白为什么

标签: javascriptjqueryfunctionprestashop

解决方案


我没有设置偏移量,而是将偏移量的值从顶部和左侧取出并将它们放在 css 部分中,如下所示:

var topoff = Math.round(imgtodrag.offset().top);
var leftoff = Math.round(imgtodrag.offset().left);

var imgclone = imgtodrag.clone()
                .css({
                    'opacity': '0.5',
                    'position': 'absolute',
                    'height': '150px',
                    'width': '150px',
                    'z-index': '100',
                    'top' : topoff + 'px',
                    'left' : leftoff + 'px',
                }).appendTo($('body'))
                    .animate({
                    'top': cart.offset().top + 10,
                    'left': cart.offset().left + 10,
                    'width': 75,
                    'height': 75
                }, 1000, 'easeInOutExpo');

结果是一样的 :)


推荐阅读