Question

单击列表项时，它会显示在带有“schtuff”类的div中我还希望它将每个单词包装在一个范围内（所以我可以设置它，或者稍后再点击一次删除它们。）

我希望每次使用我在其中单击的文本创建一个新的span标记，而不更改其他span标记。脚本：

<script>
$(document).ready(function(){

$('.shtuff li').click(function(){
//var thistext= $(this).text();

$('.display').append("<span></span>");  

$('.display span').append($(this).text());  
    });

  });//ready
 </script>

CSS：

<style>
.display span{background-color:#ccc;}
.display{border:1px solid; width:300px;hieght:100px}
ul li {list-style-type:none;}

</style>

HTML：

<div class="display">some text</div>
<ul class="shtuff">
<li>blueberry </li>
<li>cherry </li>
<li>strawberry  </li>
<li>ferret droppings </li>
</ul>

问题是它会附加到其他span标记，因为它会这样做。

Answer 1

尝试更改

$('.display').append("<span></span>");

到

$('.display').append("<span>" + $(this).text() + "</span>");

Answer 2

使用此：

$('.shtuff li').click(function(){
   $('.display').append($("<span></span>").text($(this).text()));  
});

添加包含在div内的标记中的选定文本

2 个答案: