如何在JQuery中克隆变量html元素

how to clone variable html element in JQuery

本文关键字：变量 html 元素 JQuery      更新时间：2023-09-26

我有一组div，这是数据库的元素，我想为每个div设置一个事件，这样，如果我点击其中一个，它将被克隆。我试过了，但没有用，下面是我页面上的代码:

<% @ideas.each do |idea| %>    
<div id="idea_<%=idea.id%>" class="idea">
    <%= idea.title %>
</div>
<% end %>

下面是CoffeeScript代码:

ideas = document.getElementByClassName("idea") 
for iter in [0..ideas.length - 1]
  do ->
    ideas[iter].(get_id).click -> ideas[iter].(get_id).clone().appendTo('.container');

有什么想法吗?

这是一个稍微修改的版本，应该做你正在寻找的。在Javascript/Coffeescript中要始终牢记的一件事是你的代码将在其中运行的范围。在这种情况下，使用do关键字非常重要，这样才能正确捕获iter变量。没有它，当你点击任何想法时，它总是会克隆最后一个想法，因为当点击处理程序实际执行时，iter将到达循环的结束。

ideas = document.getElementByClassName("idea") 
for iter in [0...ideas.length]
  do (iter) ->
    ideas[iter].click -> ideas[iter].clone().appendTo('.container');

这是一个修改后的版本，也更干净一些。jQuery可以为你处理所有这些交互

$('.idea').click ->
    $(@).clone().appendTo('.container')

你想用'get_id'部分做什么?我只是忽略了它，所以如果我误解了，请告诉我。

编辑:

要只克隆一次，最简单的方法是使用jQuery的'one'方法而不是'bind'方法。

$('.idea').one 'click', ->
    $(@).clone().appendTo('.container')
相关文章：