//➁子がいたら「子持ちです」を表示
したいのですが、配列の比較がうまくいかず、思うように表示されません。
コードが長いのでサンプルをご覧下さい。
サンプル:https://jsfiddle.net/psn5849w/
上のサンプルのコードは下記になります。
html
1<p>自分の番号</p><p>祖先の番号</p> 2 3<div class="alllists"> 4 <ul> 5 6 <li> 7 <div id="post-7" class="list" parent="0" ancestor="">X家 8 <span class="my_num">4</span><span class="ancestor_num"></span> 9 </div> 10 <ul class="childrens"> 11 <li> 12 <div id="post-39" class="list" parent="7" ancestor="">A 13 <span class="my_num">4</span><span class="ancestor_num"></span> 14 </div> 15 </li> 16 </ul> 17 </li> 18 19 <li> 20 <div id="post-151" class="list" parent="0" ancestor="">Y家 21 <span class="my_num">4</span><span class="ancestor_num"></span> 22 </div> 23 <ul class="childrens"> 24 <li> 25 <div id="post-200" class="list" parent="151" ancestor="">B 26 <span class="my_num">4</span><span class="ancestor_num"></span> 27 </div> 28 </li> 29 <li> 30 <div id="post-354" class="list" parent="151" ancestor="">C 31 <span class="my_num">4</span><span class="ancestor_num"></span> 32 </div> 33 </li> 34 <li> 35 <div id="post-365" class="list" parent="354" ancestor="">D(Cの子) 36 <span class="my_num">4</span><span class="ancestor_num"></span> 37 </div> 38 </li> 39 <li> 40 <div id="post-503" class="list" parent="365" ancestor="">E(Dの子) 41 <span class="my_num">4</span><span class="ancestor_num"></span> 42 </div> 43 </li> 44 <li> 45 <div id="post-514" class="list" parent="503" ancestor="">F(Eの子) 46 <span class="my_num">4</span><span class="ancestor_num"></span> 47 </div> 48 </li> 49 </ul> 50 </li> 51 52 <li> 53 <div id="post-705" class="list" parent="0" ancestor="">Z家 54 <span class="my_num">4</span><span class="ancestor_num"></span> 55 </div> 56 </li> 57 58 </ul> 59</div>
jQeery
1//➀先祖番号の連結 2function getParentNums(list) { 3 var parent_num = list.attr('parent'); 4 if (parent_num == "0") { 5 return ["0"]; 6 } 7 var parent = $("#post-" + parent_num); 8 var parent_nums = getParentNums(parent); 9 parent_nums.push(parent_num); 10 return parent_nums; 11} 12$('.list').each(function() { 13 var my_num = $(this).attr('id').split('-')[1]; 14 var list = $(this); 15 var parents = getParentNums(list); 16 var ancestor_num = parents.join('-'); 17 list.attr('ancestor',ancestor_num); 18 19 //確認のための表示 20 $(this).find('.my_num').text(my_num); 21 $(this).find('.ancestor_num').text(ancestor_num); 22 23}); 24 25 26//➁子がいたら「子持ちです」を表示 27$(".list").each(function() { 28 var my_num = $(this).attr('id').split('-')[1]; 29 var parent_num = $(this).attr('parent'); 30 var child_num = parent_num+'-'+my_num; 31 var arr = []; 32 arr.push( child_num ); 33 if (arr.indexOf(my_num) >= 0){ 34 $(this).append('子持ちです'); 35 } 36}); 37
上のコメントアウトのように
//➁子がいたら「子持ちです」を表示
ができない状態です。
簡単な説明も添えて頂けたら嬉しく思い、こちらで質問させて頂きました。
どうぞ宜しくお願い致します。
回答1件
あなたの回答
tips
プレビュー