Question

有人可以帮我修改代码，以便这个脚本可以工作吗？

这是我的HTML：

        <div class="img-wrapper item">
            <a href="/product/{{$product->id}}/{{$product->slug}}">
                <a class="thumbnail" href="/product/{{$product->id}}/{{$product->slug}}" style="margin-bottom: 0px; border: none;"> 
                <img class="media-object indexImg" src="{{$product->image}}">
                </a>
            </a>
            <div class="tags">
            @if($product->discount > 0)
                <span class="label-tags"><span class="label label-danger">Išpardavimas</span></span>
            @endif    
                <span class="label-tags"><span class="label label-info">Nauja</span></span>
            </div>
            <div class="option">
                <button class="add-to-cart" type="button">Add to cart</button>
            </div>
        </div>

这是脚本：

$('.add-to-cart').on('click', function () {
        var cart = $('.shopping-cart');
        var imgtodrag = $(this).parent('.img-wrapper').find("img").eq(0);
        if (imgtodrag) {
            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');
    });

它适用于示例，因此脚本很好。我只需要正确填写这一行：

var imgtodrag = $(this).parent('.img-wrapper').find("img").eq(0);

Answer 1

你的问题是因为.img-wrapper不是直接的父母，而是一个祖父＆＃34;。使用closest，您将获得最接近的ascendent，这是您在这种情况下所需的元素。试试这个：

var imgtodrag = $(this).closest('.img-wrapper').find("img").first();

无法读取未定义的jQuery的属性“top”

1 个答案: