Question

这应该很简单。基本上，当单击列表中的项目时，将文本插入/替换为目标div。 'replaceWith'可能不适合使用，因为它会删除原始数据。另外，如何将“选定”类添加到目标div中的文本。

无论如何，这是我到目前为止：http://jsfiddle.net/BM8Cb/

HTML

<div class="selected" id="here">
   <li>All</li>
</div> 
<hr>
<ul>
  <li>All</li>
  <li>Category 1</li>
  <li>Category 2</li>
  <li>Category 3</li>
</ul>

CSS

ul {list-style:none;padding:0; margin:0;}
li {cursor:pointer;}
li:hover {color:red;}
.selected {color:red;}

JS

$("li").click(function() {
  $("#here").replaceWith(this);

}）;

感谢您的帮助

Answer 1

怎么样？

$("li.item").click(function() {
    $("#here").html($(this).html());
});

如果你需要的只是文字。

Answer 2

将您的JS更改为：

$("li.item").click(function() {
    var item = $(this).clone();
    item.attr("class","selected");
    $(".selected").append(item)    
    $(this).hide();
});

这是小提琴：http://jsfiddle.net/J7JST/2/

这也会将所选课程添加到您的项目

Answer 3

使用replaceWith将替换DOM节点，以便下次尝试时它不再存在。你需要使用追加

$("#here").append(this);

并且通过使用'this'，你复制的一切包括事件处理程序。如果您只想要文本，您可以执行类似

的操作

$("#here").append(this.innerHTML);

更改div中的文本onClick列表中的项目

3 个答案: