Question

我在Meteor中遇到jQuery问题 - 我只是想学习，所以我希望有人可以提供帮助。

因此，当单击#addButton时，它会将div附加到.formField，并且在click上创建的每个div都将具有唯一的类，例如formField [1]，formField [2]等

问题在于单击按钮而不是仅更改div的名称时，div也会添加50次。我知道这听起来像一个循环是多么愚蠢，但是如何在点击时只循环div类，这样每个人都有不同的名字？

我的代码如下：

Template.form.events({
'click #addButton': function(event) {

var i;
for (i = 0; i < 50; i++) {

$(".formField").append('<div class="formField['+i+']">.....</div>');
}

return false;

Answer 1

如果我明白你在这做什么，你就不需要循环了。每次单击按钮时，您只需要增加一个变量。将你的追加带出循环，然后单击将变量增加1然后调用追加。没有必要的循环。

var i = 0;

Template.form.events({
    'click #addButton': function(event) {
         i += 1;

         $(".formField").append('<div class="formField['+i+']">.....</div>');
    }
});

return false;

Answer 2

这样做（即通过创建一个闭包），点击运行验证

＆＃13;

var uuid = 0;

$('#addButton').on('click', function (event) {
  uuid = uuid + 1;
  $(".formField").append('<div class="formField[' + uuid + ']">Form' + uuid + '</div>');
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<div class="formField"></div>

<input type="button" value="Add New" id="addButton"></input>

＆＃13;

循环内部jQuery函数只发出

2 个答案: