如何在javascript中创建带有文本和小删除图标的div容器答案

【问题标题】：How to create div container with text and small delete icon in javascript如何在javascript中创建带有文本和小删除图标的div容器
【发布时间】：2012-12-05 12:14:06
【问题描述】：

使用动态创建的 TextBox 和 Button 控件（ASP.NET C# 页面），我需要编写 JavaScript 函数，该函数将（通过单击按钮）在该文本旁边添加文本 + 一些小删除图标（使用户能够删除该文本)，并将其放置到某个容器（div 或其他东西）中。

不知道我解释得够不够清楚，但我想做一些与这个 stackoverflow TAGS 区域非常相似的东西（在我的例子中，应该通过单击按钮来创建标签）。

我还必须在回发后获取这些值（在用户提交该页面后将其写入数据库）。谢谢！

<script type="text/javascript"> 
function addTo(val) 
{ 
  document.getElementById('MainContent_txtbox').value = ""; 
  var lblLink = document.createElement("span"); 
  lblLink.appendChild(document.createTextNode(val));     
  document.getElementById('addItHere1').appendChild(lblLink); 
} 
</script>

点击按钮会显示在 div 标签中

Label Labe3 = new Label(); 
Labe3.Text = "<div id=\"addItHere" + itemCounter.ToString() + "\" ></div>";

【问题讨论】：

这听起来是个很酷的主意！你试过什么了？你有困难吗？
删除图标有“class”，在body中的onclick事件后，被js识别并被“delete(target.parentNode)”命令或类似命令杀死。
@Asad 是的，我创建了 javascript 函数并在单击按钮时显示在 div 标签 Label Labe3 = new Label(); Labe3.Text = "
";但我不知道继续进行（允许用户删除它，并在回发时获取这些值）。
@EL 谢谢你的回答，但我什么都不懂！？

标签： javascript asp.net postback

【解决方案1】：

首先：

<span class="post-tag">text<span class="delete-tag" onclick="delete(this.parentNode);">x</span></span>

你应该采取的下一步：学习如何为body标签附加onclick，如何确定目标，如何检查它的类属性，将其值与“删除标签”进行比较等。

【讨论】：