Question

我正在研究以下代码：

console.log("size before: " + list.size());
list.append($(newItem));
console.log("size after: " + list.size());

控制台中的输出是：

size before: 1
size after: 1
size before: 1
size after: 1
size before: 1
size after: 1

HTML：

             <ul class="form-list" id="list">
                <li>
                  <form class="form-inline" role="form">
                    <div class="form-group">
                        <label class="sr-only">Items</label>
                        <input type="date" class="form-control date-picker input-lg" id="sprint-start"></input>
                        <a href="#"><i class="glyphicon glyphicon-plus list-add"></i></a>
                        <a href="#"><i class="glyphicon glyphicon-remove list-remove"></i></a>
                    </div>
                  </form>
                </li>
              </ul>

我正在尝试在其他函数中执行基于索引的操作，并且无法使其工作，因为元素大小和索引不会更新。我可以对此做些什么吗？

我已经查看了需要load（jQuery returns null for element height? why?）的解决方案，但我不认为考虑到其他事件正在使用索引（此时它已经加载）它会起作用。

Answer 1

您的list是一个缓存的jQuery对象，它不会自行更新。您应该自己操作集合（使用add方法，如果要向集合中添加元素）或创建新集合。

另请注意，您要附加元素，jQuery不会将附加元素添加到当前集合中，如果list引用ul#list元素，size将返回集合中的选定元素不是他们的子女。您可能正在寻找children方法：

console.log("size before: " + list.children().length);
list.append($(newItem));
console.log("size after: " + list.children().length);

附加后元素的大小不会更新

1 个答案: