javascript - mCustomScrollbar 不适用于 jquery 附加

Question

在我的 html 中，我尝试通过 ajax 调用更新购物车数据。在 HTML 中

<div id="cart_list"></div>

以及内部脚本

$(document).ready(function(){
  jQuery.get("/show_header/",
          function(data) {
          show_cart(data)
         });

})

这是 show_cart 函数

function show_cart(data){
     $("#cart_list").append(
        '<div  class="dropdown  cartMenu ">'+
        '<a href="#" class="dropdown-toggle" data-toggle="dropdown"></a>'+
        '<div class="dropdown-menu col-lg-6 col-xs-12 col-md-6 " style="width: 184%;">'+
        '<div id="scroll_cart" class="w100 miniCartTable scroll-pane">'+
        '<table>'+
        '<tbody>'+
        cart_string+
        '</tbody>'+
        '</table>'+
        '</div>'+
        '<div class="miniCartFooter text-right">'+
        '<h3 class="text-right subtotal"> Subtotal:₹ '+ data.header_data.price +' </h3>'+
        '<a class="btn btn-sm btn-danger" href="/cart/"> <i class="fa fa-shopping-cart"> </i> VIEW CART </a>'+
        '<a href="/payment/" class="btn btn-sm btn-primary"> CHECKOUT </a> </div>'+
        '</div>'+
        '</div>'
      )
    }

(cart_string是在函数show_cart内生成的。但我删除了这些步骤，因为我认为它与这里无关)。

但是滚动条不再起作用了。我尝试了本节中的其他答案，但似乎没有任何效果。

我尝试为带有滚动类的 div 指定一个 id“scroll_cart”，并在 show_cart 函数中尝试以下行。但没有改变。

$("#scroll_cart").mCustomScrollbar("update");

为 div 启用滚动条的正确方法是什么？

Answer 1

您需要在创建元素后使用 $("#scroll_cart").mCustomScrollbar("update"); 。

即，在 show_cart() 函数之后。

因为元素 $("#scroll_cart") 在绑定(bind)时应该出现在 dom 上。

$(document).ready(function() {
    jQuery.get("/show_header/",
        function(data) {
            show_cart(data);
            $("#scroll_cart").mCustomScrollbar("update");
        });

})