3

在我的项目中，我每次单击按钮时都会使用 jquery 动态创建 div。现在我希望这些新的 div 具有可拖动和可调整大小的属性。这是我到目前为止所做的：

$("#button1").click(function(){
     $("<div/>", {
       "id": "test",
        text: "",
      }).appendTo("body");
     $( "#test" ).resizable();
     $( "#test" ).draggable();
  });

这段代码以某种方式工作，问题是只有创建的第一个 div 是可调整大小和可拖动的。是否可以放置另一个按钮来删除这些新创建的 div？

4

2 回答 2

5

id必须是独一无二的！您创建多个具有相同testid => INVALID HTML的 div

另一件事，你不需要查询 DOM，你可以使用你得到的引用来创建<div> resizable和draggable：

$("#button1").click(function(){
     $("<div/>", {
       "class": "test",
        text: "",
      }).resizable().draggable()
      .appendTo("body");
  });

如果您出于某种原因想使用 id ：

var counter = 1;

$("#button1").click(function(){
     $("<div/>", {
       "class": "test" + (counter++),
        text: "",
      }).resizable().draggable()
      .appendTo("body");
  });

#id文档站点中的选择器注释：

每个 id 值只能在文档中使用一次。如果为多个元素分配了相同的 ID，则使用该 ID 的查询将仅选择 DOM 中第一个匹配的元素。但是，不应依赖此行为；具有多个使用相同 ID 的元素的文档无效。

于 2012-04-25T07:31:17.313 回答
1

您应该为每次点击提供不同的 ID，或者使用具有相似名称的类。

$("#button1").click(function(){
     $("<div/>", {
       "class": "test",
        text: "",
      }).appendTo("body");
     $( ".test" ).resizable();
     $( ".test" ).draggable();
  });
于 2012-04-25T07:33:13.407 回答