0

我有一个文本区域,旁边有两个按钮:“添加另一个文本区域”和“删除这个文本区域”

这是我的html代码:

<div id="summaryIn">
                            <label for="">Summary of Experience:</label> 
                            <textarea class="TA1" name="mySummary[]" value=""></textarea>
                            <button class="adddel" name="cmdDelSummary[]" id="cmdDelSummary" title="Delete this Summary" onClick="DelSummary('summaryIn');">-</button> 
                            <button class="adddel" id="cmdAddSummary" title="Add Another Summary" onClick="AddSummary('summaryIn');">+</button>
                        </div>

我用于添加 textarea 的 javascript 函数工作正常,但是删除按钮不能正常工作,这是 javascript 代码:

function DelSummary(divName){
alert(summary_counter);
if (summary_counter == 1)
{
    document.getElementById('cmdDelSummary').disabled=true;
}
else
{
    summaryIn.removeChild(summaryIn.lastChild);
    summary_counter--;
    //alert(summary_counter);
}

}

我一直在尝试解决这个问题很长时间,但直到现在我还没有找到任何解决方案。. .我不知道如何索引/引用其他删除按钮,以便 removeChild 仅删除该特定文本区域,而不总是删除 lastChild ..非常感谢提前:)

4

2 回答 2

1

我认为你必须添加

summaryIn = document.getElementById(divName);

summaryIn.removeChild(summaryIn.lastChild);
于 2011-06-20T00:27:18.003 回答
0

这一行:

summaryIn.removeChild(summaryIn.lastChild);

似乎依赖于将元素名称和 ID 制作为引用该元素的全局变量的做法。这是一种非标准做法,尚未被所有浏览器实现。

而是使用符合标准的:

var  summaryIn = document.getElementById('summaryIn');

现在您可以调用它的removeChild方法。您也应该检查一下您将要删除的内容,因为最初“添加另一个摘要”按钮是最后一个元素子元素。

编辑

按照惯例,以大写字母开头的函数名是为协程函数保留的,所以我使用了小写字母。

要从文档中删除 div 及其内容:

// Go up DOM until reach parent element with tagName
// If no such node found, return undefined.
function upTo(el, tagName) {
  tagName = tagName.toLowerCase();

  while (el.parentNode) {
    el = el.parentNode;

    if (el.tagName.toLowerCase() == tagName) {
      return el;
    }
  }
}

function delSummary(el){
  var div = upTo(el, 'div');
  div.parentNode.removeChild(div);
}

并这样称呼它:

  <button ... onclick="delSummary(this);" ...>-</button> 

虽然 HTML 属性名称不区分大小写,但我发现使用驼峰式大小写会使它们难以阅读,因此使用小写。

于 2011-06-20T00:35:37.917 回答