Question

我正在尝试将html代码中的li元素添加到div元素中，以下是我的html代码：

放置要添加的元素的位置：

<div class="form-body" id="nitspopupmenu"></div>

ul的元素：

<div class="collapse navbar-collapse">
    <ul class="nav navbar-nav navbar-right" id="nitsmenu" data-nitspagelabel="1">
        <li class="scroll active"><a href="#navigation">Home</a></li>
        <li class="scroll"><a href="#aboutus">About Us</a></li>
        <li class="scroll"><a href="#services">Services</a></li>
        <li class="scroll"><a href="#ourteam">Our Team</a></li>
        <li class="scroll"><a href="#portfolio">Portfolio</a></li>
        <li class="scroll"><a href="#clients">Clients</a></li>
        <li class="scroll"><a href="#blog">Blog</a></li>
        <li class="scroll"><a href="#contact">Contact</a></li>
    </ul>
</div>

我的Jquery代码：

$(e).fadeIn(400);

$('#nitspagesorter').fadeIn(400).css({
    'top': mouseY,
    'left': mouseX
}).draggable();

$('#nitsmenubutton').hide();

var licount = $("#nitsmenu li").length;
for (i = 0; i < licount; i++) {
    var lielem = $("#nitsmenu li").text();
    var element = $(lielem).text();
    $("#nitspopupmenu").html("<div class='form-group'><div class='pagesmenu selected'><span><i class ='fa fa-bars'></i>" + lielem + "");
}

我正在弹出弹出框中的内容，我正确地获得li名称，但它只显示最后一个元素，即Contact， $("#nitspopupmenu").html("<div class='form-group'><div class='pagesmenu selected'><span><i class ='fa fa-bars'></i>" + lielem + "");最后正在执行，或者可能每次都替换内容并显示最后的结果

请帮忙

Answer 1

.html() 替换元素的内容，使用.append()添加。

您还需要编写有效的HTML。您有三个缺少其结束标记的开始标记。

Answer 2

我认为你应该append()使用html()

for (i = 0; i < licount; i++) {
    var lielem = $("#nitsmenu li").text();
    var element = $(lielem).text();
    $("#nitspopupmenu").append("<div class='form-group'><div class='pagesmenu selected'><span><i class ='fa fa-bars'></i>" + lielem + "");
}

如果需要多行，则应将所有字符串放在一行中，然后用+符号连接

Answer 3

请参阅documentation了解.append()指令。使用.html()指令将始终删除所选元素内的所有内容。使用.append()指令在末尾附加指定的内容。

在jquery中使用for循环添加HTML代码

3 个答案: