jquery和jScrollPane和ajax

时间:2011-02-11 03:12:45

标签: jquery jquery-jscrollpane

我正在建立一个网站上有一些ajax,我似乎已经遇到了一些障碍,让jScrollPane为我工作。

这可能很难写下来。

我有一个主页面,在它的基础上我有一个div,我用来写所有的叠加层或'lightbxes'。 e.g。

<body>
<a href="#" onclick="$('#popup').load('some-url.php');return false;">content etc</a>
<div id="popup"></div>
</body>

然后在一个这样的叠加层(some-url.php)中我有更多的内容,然后我又有了一些使用ajax填充的div。

一些-url.php

<body>
<div id="left"></div>
<div id="right"></div>
<script>
$('#left').load('another-url.php');
</script>
</body>

现在让我们说div id =“left”我想要一个jScrollPane滚动条,但它的内容是通过ajax加载的。

我试过的是'another-url.php'加载我的所有内容,然后尝试添加滚动窗格。

'另一-url.php'

<div class="wrapper>
// iterate through my DB and gets lots of content
</div>
<script>
$('#left').jScrollPane();
</script>

这失败了,它说$('#left')。jScrollPane();不是一个函数,所以我在用内容加载div之后尝试将它放在第一个叠加层中。

<body>
<div id="left"></div>
<div id="right"></div>
<script>
$('#left').load('another-url.php');
$('#left').jScrollPane();
</script>
</body>

这不会失败第一次,虽然我没有滚动...但如果我再次重新加载它再次失败再说$('#left')。jScrollPane();不是一个功能。

所以我查看了文档并尝试使用动态内容示例。

<body>
<div id="left"></div>
<div id="right"></div>
<script>
var api = $('#left').jScrollPane().data('jsp');
('a.some-link').bind(
'click',
function(){
api.getContentPane.load(
'another-url.php',
function(){
api.reinitialise();
}
);
}
);
</script>
</body>

但这一次又说$('#left')。jScrollPane();不是一个函数。当我得到其中一个错误时,网站上另一个不是ajax的jScrollPane突然停止工作,直到我重新加载页面显然jScrollPane以某种方式得到了我的屎...... / p>

我希望创建图书馆的人可能会在这里闲逛并做出回应。

1 个答案:

答案 0 :(得分:0)

我认为你需要在加载内容后将jScrollPane()设置为触发。如果我没有弄错的话,加载方法是ascynchronous,你的jscrollpane()将在内容加载到html dome $("#left")之前触发。这意味着当jscrollpane解雇时它确实不可用。尝试使用$.ajaxSetup({ascync:false});并查看是否有帮助。如果$.get不适用于加载方法,则可能必须使用$.ajaxSetup方法。

IE:

$.ajaxSetup({async:false});
$('#left').load('another-url.php');
$('#left').jScrollPane();

如果ajaxSetup不能与load方法一起使用,请尝试使用.get方法

 $.ajaxSetup({async:false});
    var $jqxhr = $.get('another-url.php');
    $jqxhr.success(function(responseText,statusText,jqxhr){
      $('#left').html(responseText);
    });
    $jqxhr.complete(function(){
      $('#left').jScrollPane();
    });
    $jqxhr.error(function(){alert("error loading content");});

希望它有所帮助。为我工作。我有类似的问题。