0

这是我的 ajax 代码，我每页有 81 个产品...
当我单击添加到购物车按钮时，页面中心会出现一个 div，但是当我将产品添加到页面的最后或底部时，div 总是出现在页面，我需要向上滚动页面才能看到它。
我想要我在页面上的结果，就像我在页面底部一样，我希望 div 出现在底部。

    <script type="text/javascript" >
        $(function() {
           $('a.addbtn').click(function(e){
                 e.preventDefault(); 
                 var quantity = $(this).attr("qty");
                 var prod_id = $(this).attr("prid");
                 var dataString = '&quantity=' + quantity + '&prod_id=' + prod_id;
                 if(quantity=='' || prod_id==''){
                    alert('some thing went wrong');
                 }
                 else{
                   $.ajax({
                      type: "GET",
                      url: "ajax_checkout.php",
                      data: dataString,
                      cache: false,
                      success: function(html){
                           $('.addcart').remove('');
                           $("#viewr").append(html);
                      }
                   });
                 }
                 return false;
            }); 
        });
    </script>
4

2 回答 2

0

虽然您可以使用 jQuery 设置它的样式并设置一个inline style，top但我总是会使用css它并将其放置在浏览器的顶部。虽然这意味着，在您关闭盒子之前，它会一直存在，它不会固定在打开的位置。

 .addcart {
      position: fixed;
      top: 10px;
 }

应该做的伎俩

于 2013-04-10T12:48:16.097 回答
0

使 div 查看器的位置固定。像这样：

    #viewr{    
        width:30em;
        height:18em;
        border: 1px solid #ccc;
        background-color: #f3f3f3;
        display:none;
    }

使用任何你想要设置样式的类
现在在 jquery 中添加这个函数，这将使屏幕中心出现：

jQuery.fn.center = function () {
    this.css("position","absolute");
    this.css("top", Math.max(0, (($(window).height() - $(this).outerHeight()) / 2) + 
                                                $(window).scrollTop()) + "px");
    this.css("left", Math.max(0, (($(window).width() - $(this).outerWidth()) / 2) + 
                                                $(window).scrollLeft()) + "px");
    return this;
};

现在在您的成功函数中执行以下操作，使其在一段时间后可见和不可见：

success: function(html){
    $('#viewr').html(html);
    $('#viewr').fadeIn('slow').center().delay(2000).fadeOut('slow');
}

不要使用 append()，它总是将 html 附加到 div 中。
延迟量以毫秒为单位，因此请将其设置为您需要的任何值。
这应该可以解决问题

于 2013-04-10T12:56:54.880 回答