Question

在此ajax请求中，我从数据库获取一些数据，然后使用 javascript 生成 HTML ，但有时 CatItemDetails * div *太大，需要滚动才能显示所有数据。

我试图这样做：

$("body").on("click", ".store", function() {
    event.preventDefault();
    $("#cat02 .CatLoader").fadeIn("fast");
    $('#cat02 .CatData').html('');

    var store_id = $(this).attr('store_id');
    var category_name = $(this).attr('cat_name');
    $("#cat02 .CatDataTitle").html(category_name);
    url = 'stores/store/';
    var posting = $.post(url, {store_id: store_id});
    posting.done(function(data) {
        var JSONObject = $.parseJSON(data);
        var store = '';
        store += '<div class="CatItemsName">' + JSONObject.name + '</div>';
        store += '<div class="CatItemsDetails" id="store-details">';
        store += JSONObject.description;
        store += '</div>';
        store += '<div class="CatItemsOptn">';
        store += ' <div class="CatItemsOptnImg"><img src="' + JSONObject.images + '" alt="" /></div>';
        store += '  <ul>';
        store += '     <li><span class="IconsFont IconsFont-phone"></span><div class="CatItemTxt">' + JSONObject.phone + '</div><div style="clear:both"></div></li>';
        store += '     <li><span class="IconsFont IconsFont-link"></span><div class="CatItemTxt"><a href="' + JSONObject.website + '" target="_blank">' + JSONObject.website + '</a></div><div style="clear:both"></div></li>';
        store += '     <li><span class="IconsFont IconsFont-map-marker"></span><div class="CatItemTxt">' + JSONObject.address + '<div style="clear:both"></div></div></li>';
        store += ' </ul>';
        store += '</div>';
        $('#cat02 .CatData').html(store);
    });
    posting.always(function() {
        $("#cat02 .CatLoader").fadeOut();
        $("#store-details").mCustomScrollbar({
            scrollButtons: {
                enable: true,
            },
            advanced: {
                updateOnContentResize: true,
                updateOnBrowserResize: true
            }
        });
    });
});

出于某种原因，这对我不起作用!!

Answer 1

问题是您无法在多个地方使用 mCustomScrollbar ，例如：

$("#store-details").mCustomScrollbar({
            scrollButtons: {
                enable: true,
            },
            advanced: {
                updateOnContentResize: true,
                updateOnBrowserResize: true
            }
        });

$("#data").mCustomScrollbar({
            scrollButtons: {
                enable: true,
            },
            advanced: {
                updateOnContentResize: true,
                updateOnBrowserResize: true
            }
        });

只有第一个才有效。它必须是这样的：

$("#store-details, #data").mCustomScrollbar({
            scrollButtons: {
                enable: true,
            },
            advanced: {
                updateOnContentResize: true,
                updateOnBrowserResize: true
            }
        });

如何将mCustomScrollbar添加到由javascript生成的div？

1 个答案: