私はかなりの ajax を含むサイトを構築していますが、jScrollPane を機能させるために少し障害が発生したようです。
これは書きにくいかもしれません。
メインページがあり、そのベースにすべてのオーバーレイまたは「lightbxes」を書き込むために使用する div があります。例えば
<body>
<a href="#" onclick="$('#popup').load('some-url.php');return false;">content etc</a>
<div id="popup"></div>
</body>
次に、そのようなオーバーレイ (some-url.php) の 1 つに、さらにコンテンツがあり、さらに ajax を使用して入力される div がいくつかあります。
some-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 が何らかの形で私と一緒にたわごとを取得しています...
ライブラリを作成した人がここにたむろして応答してくれることを願っています。