添加附加数据并删除所选数据

Question

小提琴 - http://jsfiddle.net/Y9K8p/1/

我正在为平板电脑的基本网站设计师工作。它的工作原理是将html和css镜像到textarea，以便于预览和保存。

要添加一个元素，用户需要做的就是在文本框中输入它，如果它有一个类，它们也可以添加它。哪个会附加为<header></header>没有类，<header class="head"></header>附加一个类。

不会删除正文，但用户添加的其他内容都可以删除。因此，如果我单击或触摸带有值标题的输入，请单击“删除”。我不想删除所有标题，只是首先添加到正文中的标题，如屏幕截图所示。

我不确定如何解决这个问题，因此我要问，＆＃34;如何实现这一目标？＆＃34;。

非常感谢任何帮助。

我准备去上班，所以今晚下午5点才能查看这篇文章。我做了一个简单的小提琴，表明了我想要做的事情。

以下代码：

var counter = 2;

$(".add-html-class").click(function () {
    $(".html-elms").append('<input type="text" id="text' + counter + '" value="<'+ $(".html-elm").val() +' class="'+ $(".html-elm-class").val() +'">" disabled="true">');
    counter++;
})

$(".del-html-class").click(function () {
    if (counter == 2) {
        alert("No more textbox to remove");
        return false;
    }
    counter--;

    $(".html-elms #text" + counter).remove();
});

Answer 1

你有额外＆lt; ＆GT;在你的追加代码中，它是分裂元素：

http://jsfiddle.net/jFIT/Y9K8p/13/

 $(".html-elms").append('<input type="text" id="text' + counter + '"
   value="'+ $(".html-     elm").val() +'"  
  class="'+ $(".html-elm-class").val() +'" disabled="true">');

Answer 2

Working Fiddle

但有一件事我不清楚你的问题，如果你想删除首先添加的元素，你必须搜索它然后删除它。将所有数组放入数组然后将其放入for循环然后将其删除。如果您愿意，这是可选的。否则看起来小提琴，工作正常，添加文本框并删除。

$(".add-html-class").click(function () {
   $(".html-elms").append('<input type="text" id="text' + counter + '" value="'+ $(".html-elm").val() +'" class="'+ $(".html-elm-class").val() +'">');
   counter++;
})

我喜欢你的项目理念。非常好。我认为它的HTML创建者是你正确的做法吗？