Question

HI，我遇到了jQuery，jScrollPane和使用AJAX加载数据的问题。当我有静态数据div时，scrollpane工作正常，但是当我在div中使用AJAX加载数据时，滚动窗格就会消失。

我知道我必须在之后重新初始化滚动窗口，所以我这样做..但可能是错误的，因为它不起作用。

因此，以下示例在加载时工作正常，但是当我单击主页按钮时，滚动条消失。有什么建议吗？

代码：

<html>
<head>
<title>Title of my page</title>
<link rel="stylesheet" type="text/css" href="style.css">
<link type="text/css" href="jquery/jquery.jscrollpane.css" rel="stylesheet" media="all" />
<script src="jquery/jquery-1.4.2.min.js"></script>

<!-- the jScrollPane script -->
<script type="text/javascript" src="jquery/jquery.jscrollpane.min.js"></script></head>
<body style="background-color: black;">
<div style="background-image: url(test.jpg);background-repeat: no-repeat;  width: 1024px; height: 768px; margin-left: auto; margin-right: auto;">
    <div id="menu">
        <script type="text/javascript">
        $(document).ready(function(){

                        reinitialiseScrollPane = function()
            {
                $('#contents').jScrollPane();

            }

            $("#home").click(function(){ $("#contents").load("lorem.php", '', reinitialiseScrollPane); });


                        $("#contents").jScrollPane();   

        });
        </script>
        <a id="home"><span>Home</span></a>

    </div>
    <div id="website">
        <div id="contents" name="contents">

        </div>

    </div>
</div>
</body>

Answer 1

你需要在ajax中重新加载滚动面板功能，当你打电话给他时，我想......

Answer 2

这需要我多年的时间才能解决，因为大多数示例使用追加来拼凑各种各样的部分。我知道一个迟到的回复，但希望能帮助某人

    function loadNews(eid){
        var pane = $('#storyColumnNewsStory').jScrollPane({scrollbarWidth:12, scrollbarMargin:8, autoReinitialise: true});
        var contentPane = pane.data('jsp').getContentPane();
        var jspapi = pane.data('jsp');

        contentPane.load('_news.php', {'eid':eid}, 
            function(){ jspapi.reinitialise(); }
        );
    }


    $(document).ready(function() {
            loadNews(0);
    });

jQuery中jScrollPane中ajax加载内容的问题

2 个答案: