我正在建立一个网站上有一些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>
我希望创建图书馆的人可能会在这里闲逛并做出回应。
答案 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");});
希望它有所帮助。为我工作。我有类似的问题。