Question

JavaScript

$(".display_box").on('click', function () {
    var name = $(this).attr("data-name");
    var x = document.getElementById('added-people').innerHTML;
    $("name").insertAfter(x);
});

HTML

<div id="added-people" 
    style="margin-left:1%;
           min-height:15px;
           width:71.7%;
           background:#f2f4f5;
           font-family: 'lucida grande',tahoma,verdana,arial,sans-serif;
           font-size: 9px;color: #212121;">
</div>

使用while循环生成显示框。因此，当单击一个显示框时，将获取其名称并显示在“added-people”div中。我希望当再次单击一个显示框时，所提取的名称应显示在前一个名称旁边，依此类推。

Answer 1

$(".display_box").on('click', function () {
    var name = $(this).data("name") // use .data() to grab data-name
    var x = $("#added-people") // $("#id") same as document.getElementById('id')
    x.append( '<span>' + name + '</span>' );
});

Answer 2

您可以使用jquery Append函数，该函数会在您的案例中 var x 的文本末尾附加

在先前添加的元素之后插入新元素

2 个答案: