Question

我运行此代码将xml数据加载到表中，但是在加载数据后，我似乎无法重新加载滚动条。没有任何作用，甚至没有在Firebug中手动运行$('.scroll-pane').jScrollPane();。

以下是代码：

$("#MenuList").html('<div class=\"menu-activity\">Please Wait</div>');
$.blockUI();

           $.get('venuesxml.php', function (data) {

                $('#MenuList').html("<div class=\"menu-activity\">Showing activity for 13.10.2012</div>");

                $(data).find('marker').each(function () {

                    $('#MenuList').append("<div class='menu-item-red'><div class='typename'>Event</div><div class='eventname'>" +

                    $(this).attr('id') + "</div><div class='venuename'>" +

                    $(this).attr('venue_type') + "</div></div>");

                });

            });

            $.unblockUI();
            $('.scroll-pane').jScrollPane();

And here's a live demo点击“搜索”以执行代码。

Answer 1

通常，必须在JSP上调用reinitialise（）以使其动态识别放置在其中的任何数据...例如在AJAX调用之后。看起来这里可能有时间问题..

 var api = $('.scroll-pane').data('jsp');
 api.reinitialise();

或者您可以使用autoReinitialise，它只是一个调用reinit的JS计时器。我更喜欢在适当的时候使用手动方法。

你想读完这篇文章。 http://jscrollpane.kelvinluck.com/api.html

Answer 2

添加动态内容后，您需要重新初始化插件。

试试这个：

 $(function()
{
    // Initialise the scrollpanes
    $('.scroll-pane').jScrollPane();

    // Add some content to #pane2
    var pane2api = $('#pane2').data('jsp');
    var originalContent = pane2api.getContentPane().html();
    pane2api.getContentPane().html(originalContent + originalContent + originalContent);

    // Reinitialise the #pane2 scrollpane
    pane2api.reinitialise();
});

More information can be found here

Answer 3

你可以尝试这样做.....

    //Should it (the #parentContainer) have had a "scroll-pane" class

        $('#parentContainer').jScrollPane()

    $.each(data, function(i, value) {

//Detach scrolling capabilities
        $('#parentContainer').jScrollPaneRemove();

        $('<div/>',{
        class:'anyClass',
        id:'anyId'
        })
        .appendTo(#childContainer);

//Return back Scrolling capabilities to the parent container    
        $('#parentContainer').jScrollPane();            


        ///-> Loop Ends
                });

这样，每次循环时都会更新滚动功能....因此，ScrollBar的长度会根据子容器中数据存储的大小而增大或缩小。

希望有所帮助....

一百假日

添加动态内容后Jscrollpane不会更新

3 个答案: