Question

我遇到了独特元素ID的问题？

我在这里做错了什么？

HTML：

<div id='gmapItemHolder'></div>

<button id='btnCreateMarker'>Add</button>

Jquery：

$("#btnCreateMarker").click(function () {
    i = 1;
    var gmapItemsHolder = "gmapItems" + i++;

    $('<ul>' + '</ul>')
        .attr({id: gmapItemsHolder, class: 'gmapUlHolder row-fluid'}).prependTo('#gmapItemHolder')
});

更新

所发生的事情是所有新创建的ul都获得ID 1

Answer 1

i的范围是本地的，因此它不会保持点击之间的状态。增加i的范围，以便在事件之间保留它。

  var i = 1;
  $("#btnCreateMarker").click(function () {

      var gmapItemsHolder = "gmapItems" + i++;

      $('<ul>'
         + '</ul>'
         ).attr({id: gmapItemsHolder, class: 'gmapUlHolder row-fluid'}).prependTo('#gmapItemHolder')
  });

Answer 2

正如凯文所说，问题是i每次都被使用和丢弃。

但不要按照他的建议创建一个全局变量。相反，将代码包装在作用域函数中并在那里定义：

(function() {
  var i = 1;
  $("#btnCreateMarker").click(function () {

      var gmapItemsHolder = "gmapItems" + i++;

      $('<ul>'
         + '</ul>'
         ).attr({id: gmapItemsHolder, class: 'gmapUlHolder row-fluid'}).prependTo('#gmapItemHolder')
  }); 
})();

这样，i被click事件处理程序的所有调用共享，但它不是一个全局变量。

Answer 3

试试这个：

var i =jQuery("#gmapItemHolder").children().length + 1;
var gmapItemsHolder = "gmapItems" + i;

取代：

i = 1;
var gmapItemsHolder = "gmapItems" + i++;

唯一元素ID

3 个答案: