首页 文章

无法使用javascript删除文本框

提问于
浏览 次
2

我正面临使用js删除文本框的问题 . 我正在使用下面提到的代码

<html>

        <head>
        <script language=javascript>
        function addElement() {
        var ni = document.getElementById('myDiv');
        var numi = document.getElementById('theValue');
        var num = (document.getElementById('theValue').value -1 + 2);
        numi.value = num;
        var newdiv = document.createElement('div');
        var divIdName = 'my'+num+'Div';
        newdiv.setAttribute('id',divIdName);
        newdiv.innerHTML = '<input type=text id=' + num + ' value=' + num + '><a href="javascript:remove('+divIdName+')">Remove</a>';
        ni.appendChild(newdiv);
        }


        function remove(dId) {
        var ni = document.getElementById('myDiv');
        ni.removeChild(dId);
        }

        </script>
        </head>

        <body>

        <input type="hidden" value="0" id="theValue" />
        <p><a href="javascript:addElement()" >Add TextBox</a></p>
        <div id="myDiv"></div>

        </body>
        </html>

这段代码在没有html Headers 的情况下工作正常！DOCTYPE html PUBLIC“ - // W3C // DTD XHTML 1.0 Transitional // EN”“http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd “>如果我将此 Headers 添加到代码中删除链接不起作用 . 这个代码有什么问题 .

javascript html

1 回答

  • 1

    方法 .removeChild 仅适用于父节点及其直接子节点 .

    相反，您可以使用更通用的删除功能来自动选择父级 .

    function remove(dId){
    var rem = document.getElementById(dId);
    rem.parentNode.removeChild(rem);
}

    编辑：

    另一个问题是删除锚点的innerHTML . 它需要发送一个字符串并尝试发送变量 .

    newdiv.innerHTML = '<input type=text id=' + num + ' value=' + num + '><a href="javascript:test(\''+divIdName+'\')">Remove</a>';

    现有代码在IE8和Chrome中运行但在FF中失败 . 这个函数适用于所有这三个，但我有点迷失为什么......看看firebug它显示相同的DOM结构，也许其他人可以澄清？

    回复于

相关问题