追加到動態元素？

我有一個數據庫的記錄，其中包含每個記錄的父子數據。我試圖創建一個父子名單，但我在創建子列表的問題：追加到動態元素？

$(document).ready(function() { 
    var objCategories = new Object ({ 
     id: 0 
    }); 
    $('#load-structures').click(function(event) { 
     event.preventDefault(); 
     objCategories.id = $(this).attr("data-category"); 
     categories(); 
    }); 
    function categories() { 
     $(".flash").show(); 
     $(".flash").fadeIn(400).html("Loading..."); 
      $.ajax({ 
       url: base_url + "notes/jq_get_structures/" + objCategories.id, 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       cache: false, 
       success: function (element) { 
        $(".flash").hide(); 
        $(".load-link").addClass("link-none"); 
        for (var i=0;i<element.length;i++) { 
         if (element[i].parent == 0) { 
          $("#links-structures-parents").append('<li id="structure-parent-' + element[i].structure_id + '"><a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a></li>'); 
         } else if (element[i].parent > 0) { 
          if ($('#structure-children-' + element[i].structure_id).length) { 
           $("#structure-children-" + element[i].structure_id).append('<li id="structure-child-' + element[i].structure_id + '"><a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a></li>'); 
          } else { 
           $("#structure-parent-" + element[i].structure_id).html('<ul id="structure-children-' + element[i].structure_id + '">'); 
           $("#structure-parent-" + element[i].structure_id).html('<li id="structure-child-' + element[i].structure_id + '"><a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a></li>'); 
           $("#structure-parent-" + element[i].structure_id).html('</ul>'); 
          } 
         } 
        } 
       }, 
       error: function() { 
        $("#links-structures-parents").empty(); 
        $("#links-structures-parents").append('<li>There are no Structures.</li>'); 
       } 
      } 
     ); 
    } 
});

有與數據本身沒有問題，但代替上述條件的部分，由此我試圖創建孩子名單。

我有一些example code，雖然在我的生活中，我不能讓它在本地運行數據，但我希望有人知道什麼是訣竅。

來源

2013-08-23 Wayne Smallman

你不完全說出了什麼問題，只是你有一個問題。 –

@安頓，它在那裏，所以我不確定你怎麼看不到它。 –

@PatrickEvans「...而是我嘗試創建子列表的條件部分。」我無法創建子列表。 –

您在else語句中的代碼重寫了html代碼，因此最後一次調用只會使元素具有</ul>，您需要將新代碼添加到新代碼中，或者一次性完成。

else { 
    var eleobj = $("#structure-parent-" + element[i].structure_id); 
    eleobj.html('<ul id="structure-children-' + element[i].structure_id + '">'); 
    eleobj.html(eleobj.html()+'<li id="structure-child-' + element[i].structure_id + '"><a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a></li>'); 
    eleobj.html(eleobj.html()+'</ul>'); 

    //Though you could do this in one call 
    eleobj.html(
     '<ul id="structure-children-' + element[i].structure_id + '">'+ 
     '<li id="structure-child-' + element[i].structure_id + '">'+ 
     '<a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a>' + 
     '</li></ul>' 
    ); 
}

來源

2013-08-23 13:40:42

謝謝，但他們充滿了錯誤（假設他們是分開的），並且由於我不明白你在做什麼，我不知道如何解決它們。 –

我已經採取了整個更新的代碼示例，並用它替換了最後一個else語句，但它正在做任何事情。 –

只有我看到的錯誤是我沒有最後一個串聯的最後一個'+'。我在第一部分中添加的唯一東西是添加eleobj.html（）+部分，它將元素的前一個內容添加到字符串中。在第二部分中，我只是把整個事情連接起來，以便只做一個電話。 –

好了，到了最後，這是與親子ID的問題屬性：

$(document).ready(function() { 
    var objCategories = new Object ({ 
     id: 0 
    }); 
    $('#load-structures').click(function(event) { 
     event.preventDefault(); 
     objCategories.id = $(this).attr("data-category"); 
     categories(); 
    }); 
    function categories() { 
     $(".flash").show(); 
     $(".flash").fadeIn(400).html("Loading..."); 
      $.ajax({ 
       url: base_url + "notes/jq_get_structures/" + objCategories.id, 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       cache: false, 
       success: function (element) { 
        $(".flash").hide(); 
        $(".load-link").addClass("link-none"); 
        for (var i=0;i<element.length;i++) { 
         if (element[i].parent == 0) { 
          $("#links-structures-parents").append('<li id="structure-parent-' + element[i].structure_id + '"><a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a>'); 
         } else if (element[i].parent > 0) { 
          var htmlElementParent = $("#structure-parent-" + element[i].parent); 
          var htmlElementChild = $("#structure-children-" + element[i].parent); 
          var htmlElementChildren = $("ul#structure-children-" + element[i].parent + " li"); 
          if (htmlElementChildren.length == 0) { 
           htmlElementParent.append(
            '<ul id="structure-children-' + element[i].parent + '">' + 
            '<li id="structure-child-' + element[i].structure_id + '">' + 
            '<a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a>' + 
            '</li></ul>' 
           ); 
          } else if (htmlElementChildren.length > 0) { 
           htmlElementChild.append(
            '<li id="structure-child-' + element[i].structure_id + '">' + 
            '<a href="#structures" title="View ' + element[i].name + '" class="structures">&lsquo;' + element[i].name + '&rsquo;</a>' + 
            '</li>' 
           ); 
          } 
         } 
        } 
        $("#load-structures").hide(); 
       }, 
       error: function() { 
        $("#links-structures-parents").empty(); 
        $("#links-structures-parents").append('<li>There are no Structures.</li>'); 
       } 
      } 
     ); 
    } 
});

在這裏，你會看到，我追加到無編號列表，其ID屬性包含父值，然後將列表項目送入各自的和適當的未編號列表。

來源

2013-08-24 10:38:18

追加到動態元素？

回答

相關問題