绑定附加元素的方法

时间:2016-06-03 20:24:17

标签: javascript jquery class methods append

我有一个使用this.move方法的AgentClass。它使用的是静态对象,但是当我通过.append()创建新的HTML对象时,我无法将它们与my.move方法一起使用。

所有新对象都有ID,我想用move方法为它们设置动画。

我经常读“活着,上......”但他们都需要一个活动......我没有这样的活动。他们直接移动。我尝试过类似的东西:

$('.agents').on("load", Agent.move());

但那不起作用......有什么想法吗?

Codesinppet:

var Agent = function(agentType, xTarget, yTarget) {
    ...
    this.move = function() {
        var id = this.agentId;

        $('.agent#'+id).animate({
            left:"200px"
        }, 1000);
    }
}

我在此之后追加他们:

for (deployed = 0; deployed <= agents; deployed++) {
    $('.agents').append('<div class="agent" id="'+deployed+'"></div>');
}

如果有人可以帮助我,那真是太棒了!?

1 个答案:

答案 0 :(得分:3)

  

你可以使用.clone(true)   一个布尔值,指示是否应将事件处理程序和数据与元素一起复制。默认值为false。

    var agents = 6;
    for (deployed = 0; deployed <= agents; deployed++) {
        $element = $('<div class="agent" id="'+deployed+'"></div>').clone(true);
        $('.agents').append($element);
    }
.agent {
  height:50px;
  width:50px;
  background-color:yellow;
  margin-bottom:10px
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<!DOCTYPE html>
<html>
<head>
<title>Agent</title>
</head>

<body>
  <div class="agents">
  </div>
</body>

</html>

但是对于最大化优化事件,最好使用“on”事件处理程序来监视重新加载DOM后将添加的项目。 这会分配更少的内存