一部のコンテンツを #BlogContainer div に AJAX しようとしていますが、クリック機能が正しく機能していないようです。if文でバラバラになっているようですが、原因がわかりません。私はアラートでテストしましたが、JSON からのリターンは正常に行われています。初期ロードも正常に機能します。JSON リターンを反復処理し、動作していないように見えるロード関数に URL を返すだけです。
私が実現したい効果は、コンテンツを指す JSON ファイルの .load と URL を使用して、ページ コンテンツ (ブログ エントリ) を #BlogContainer div にロードし、#Nexus div をクリックするたびに次へと反復することです。
私の主な質問は、JSON リターンを介して動的にロードするための最良の方法は何ですか? まったく同じことを行う each 関数もありました(正しい結果を返すように見えましたが、実際にはコンテンツをロードしませんでした)。私が読んだところ、わずかに効率的であることがわかったので、代わりに for ループを使用することにしましたが、私の場合には大きな影響があるとは思えません。
私は JS / JQ をまったく初めて使用し、以前は JQueryTools を使用してすべてを希望どおりに機能させていましたが、学習する最善の方法は自分で行うことだと思いました (もちろん少し助けて:))。
HTML
<div id="BlogContainer"></div>
<div id="NexusRef" alt="03151201.htm">'03151201.htm'</div>
JSON
{
"0": "'03151201.htm'",
"1": "'01191201.htm'",
"2": "'00000103.htm'",
"3": "'00000102.htm'",
"4": "'00000101.htm'"
}
Javascript
$(function() {
$('#Navigation').load('navi.htm');
$('#BlogContainer').load('03151201.htm');
$('#TT1').load('ajtt1.htm');
$('#TT2').load('ajtt2.htm')
});
$(function() {
$('#Nexus').click(function() {
$.getJSON("BlogRoll.json", function(data) {
var i = 0;
var n = ($('#NexusRef').html());
var length = data.length;
for (i = 0; i < length; i++) {
if (data[i] == n) {
$(function() {
$('#BlogContainer').load(data[i + 1]);
});
} else {
alert(data[i + 1]);
}
}
});
});
});