Question

我发现了很多关于此的信息，但我还没有找到任何可以帮助我的东西。

我的问题是我有一个带有id的div，它假设是一个容器（#cont_seguim）。我在右侧有一个菜单，其中包含圆圈（由css制作并填充文字），如下所示：

<div class="circle_menu b">
    <div class="text_menu n">ECO</div>
</div>

其中b和n是背景和文本的格式。当我点击一个圆圈时，必须将这个圆圈添加到容器中（注意每个圆圈都有自己的文本），但我无法得到它。

我制作了数组并使用alert（）来测试点击是否有效，但确实如此，但是append（）甚至无法打印文本，我不知道为什么。

<script type="text/javascript">
    var arrayS = new Array();

    $(document).ready(function() {
        $(".circulo_menu").click(function() {
            var text = $(this).text();
            alert("calling " + text);
            $("#cont_seguim").append(text);
        });
        return text;
    });

</script>

感谢您的回复！

Answer 1

尝试使用html()代替text()。

Answer 2

无法正确理解，希望下面可以帮助你。

<script type="text/javascript">
      $(document).ready(function() {
        $(".circulo_menu").click(function() {
            var myText = $(this).html(); 
            alert("calling " + myText);
            $("#cont_seguim").html(myText);
        });
    });

</script>

确保classname和id名称与html

保持一致

Answer 3

您的代码似乎工作正常（如果您修复了html vs script circulo_menu vs circle_menu 中使用的不同类名）

http://jsfiddle.net/7jbUj/

演示

要添加整个圆圈，请使用.append(this)

附加整个元素而不是其文本

    $(".circle_menu").click(function() {
        $("#cont_seguim").append(this);
    });

http://jsfiddle.net/7jbUj/1/

演示

要添加圈子的副本，以便添加多个圈子，请先使用.clone() ..

    $(".circle_menu").click(function() {
        var clone = $(this).clone(false);
        $("#cont_seguim").append(clone);
    });

http://jsfiddle.net/7jbUj/3/

演示

在click处理程序中，this引用单击的元素。由于您绑定了click元素上的circle_menu处理程序，this引用了该{{1}}元素。您可以直接使用它来附加或克隆它来制作副本..

Answer 4

试试这个： Demo

HTML：

<div class="circle_menu b">
    <div class="text_menu n">ECO</div>
</div>
<div id="cont_seguim"></div>

使用Javascript：

$(document).ready(function() {
    $(".circle_menu").click(function() {
        var text = $(this).html();
        console.log("calling " + text);
        $("#cont_seguim").append(text);
    });
});

Answer 5

试试这个：

$( ".container" ).append( $( "<div>" ) );

source

Answer 6

使用

$("#container").append($("<div/>", {id:"newID",text:"sometext"}));

Answer 7

你可以尝试

<script type="text/javascript">
 var arrayS = new Array();

$(document).ready(function() {
    $(".circulo_menu").click(function() {
        var text = $(this).text();
        alert("calling " + text);
        $("#cont_seguim").append($(this).html());
    });
    return text;
});

</script>

通过这种方式，点击的圆圈元素被添加到div

如何动态地将自己的<divs>添加到容器中？</divs>

7 个答案: