Question

我有一个拖放元素工具。我想在任何元素被删除到页面之前添加div。可能吗？我尝试使用live来实现它，但是它增加的数字div很奇怪。第一次，它增加了一两次和第二次。它增加了两个以上。我正在尝试这个：

$('#PageContent > .textElementClass').live('dblclick', function(e) {
ElementWidth=$(e.target).width();
targetElement=$(e.target);
$(e.target).css({'display':'none'});
$(e.target).before('<div id="TextValue" style="'+ElementWidth+'"><textarea cols="50" rows="10">Edit Content</textarea><input type="button" value="Save" class="SaveContent"></div>');

$('.SaveContent').live('click', function(e){
 firstChild=$('#TextValue > textarea').html();
 $(targetElement).html(firstChild);
 $(targetElement).css({'display':'block'});
 $('#TextValue').remove();
});
   });

Answer 1

您需要在此处进行一些更改，首先是ID不能在页面中多次使用，因此如果您动态添加内容，则不应包含与此相同的ID：< / p>

<div id="TextValue">

但是，您不需要ID，您只需触发<textarea>使用tree-traversal点击的<div>即可找到相对于您点击的内容的$(this).siblings("textarea").val();，例如这样：

style="40"

这也使用.val()来获取值，使用此代替.html()。此外，您可以使用.show()和.hide()代替手动设置.css()。

当您设置样式时，它结束为<div>，这是无效/无效... this应该拉伸到适当的宽度，所以我删除了这一部分。如果需要，可以通过.width(valueToSet)将其添加回来。

最后，您可以在.live()处理程序中使用.live('click',...)，而您的.live('dblclick',...)应该 <{1}}，否则它会添加< em>附加每次添加元素时保存点击处理程序，每次都会额外保存并删除。

总的来说，它看起来应该更像这样：

$('#PageContent > .textElementClass').live('dblclick', function() {
  targetElement = $(this).hide()
                         .before('<div><textarea cols="50" rows="10">Edit Content</textarea><input type="button" value="Save" class="SaveContent"></div>');
});
$('.SaveContent').live('click', function(){
  var ta = $(this).siblings("textarea").remove();
  $(targetElement).html(ta.val()).show();
});

我可以在将来动态添加的元素之前添加div吗？

1 个答案: