【超至急】jQueryで動的サイトをappendで作成する際、タグが勝手に変換されて困っています。
■ソースコード
<head>
<script>
var list = ['a', 'b', 'c', ...];
$.each(list, function(i, item) {
var max_length = item.length;
var m = '';
if (i == 0) { … [A処理]
m += '<div>';
m += '<div>';
m += '<div>';
}
<****> … [B処理]
if (i == max_length) { … [C処理]
m += '</div>';
m += '</div>';
m += '</div>';
}
$("#test").append(m);
</script>
</head>
<body>
<div id="test"></div>
</body>
■実行結果
<div><div><div> ← [a結果]
<****>
</div></div></div> ← [b結果]
<****>
<****>
;
<****> ← [c結果]ループの最後
■環境
IE10, FireFox22, Chrome28,IOS6(Safari)
■質問
ループの最後に[C処理]が行われてほしいのですが、[C処理]は実際には行われていません。
このためか、[b結果]に[C処理]があるように見えますが、これはブラウザ？が勝手につけています。これは、PCブラウザのデバッガで確認しております。max_lengthも正しいですし、固定値にしても結果は変わりません。
なぜこのようなことが起こるのでしょうか？
実際にはもう少し複雑な分岐がありますが、上記の基本動作が動かないために非常に困っております。
至急で申し訳ありませんが、アドバイスや問題点をご指摘願います！！
ベストアンサー
-
Cherenkov
満足34pt
タグのとじ忘れとかがあるのかな。
あと、$("#test").append(m);の時点で#testが存在することが保証されていないのでお決まりの$(function(){ document読み込み後に実行したい処理 });
が必要かと。
文字列でHTMLを組むのではなくDOMElement的(?)に組んだほうがわかりやすいと思います。var m = $('<div>'); m.append($('<div>'));
これで↓が生成される。
<div><div></div></div>
-
その他の回答
-
Lhankor_Mhy
満足33pt
括弧の対応がずれているのでこれでエラーなく動くとは思えません。コピペミスってませんか？
正しいコードの構造が分かりませんのでなんとも言えませんが、変数をウォッチしてみるといいかもしれませんね。
たとえばvar list = ['a', 'b', 'c']; $.each(list, function(i, item) { var max_length = item.length; console.log(i,max_length) }) //実行結果（itemは配列ではない） //0 1 //1 1 //2 1
あるいは
var list = ['a', 'b', 'c']; var max_length = list.length; $.each(list, function(i, item) { console.log(i,max_length) }) //実行結果（iはmax_lengthとイコールにならない） //0 3 //1 3 //2 3
のようなことが起きているのでは。
-
- その他の回答を読む
Lhankor_Mhyこの質問へのコメント
質問の情報
- 登録日時
- 2013-08-18 21:36:45
- 終了日時
- 2013-08-24 00:30:01
- 回答条件
- 1人5回まで
この質問のカテゴリ
この質問に含まれるキーワード
人気の質問
-
数年前（十年以上前かもしれません）に見たサイトを探しています。 日本の、地域のキリスト教の教会につい…
匿名質問者
1
-
戦前、バスの通る道で「赤い旗を持って」とは？ 林芙美子の童話「蛙」(*)の最後近くで、次のようになって…
sibazyun
23
-
ログインしなくて良い質問サイト教えて下さい
山田生活11
-
一日だけこっそり過ごせるなら？
jqpk0izg2
-
下記の動画シリーズに使われているBGMは何の曲でしょうか？ 茜お姉ちゃんがバイトする話 １日目 - ニコニ…匿名質問者