IE6和7无法在javascript中检测动态添加的复选框

时间:2011-07-16 21:08:32

标签: javascript forms dynamic internet-explorer-6 elements

我的AJAX应用程序中有这样的东西:

      <html>
<head>
    <script type="text/javascript">
        var counter=4;
        function newcheckbox() {
            var newrow=document.getElementById('tabl').insertRow(0);
            var cell1=newrow.insertCell(0);
            var n=document.createElement("input");
            n.type="checkbox";
            n.name="item";
            cell1.appendChild(n);
            var cell2=newrow.insertCell(1);
            cell2.innerHTML=counter;
            counter++;
        }
        function listlength() {
            alert(document.list.item.length);
        }
    </script>
</head>
<body>
    <button onclick="newcheckbox();">new checkbox</button>
    <button onclick="listlength();">alert checkbox list length</button>
    <form name="list">
    <table id="tabl">
        <tr>
            <td><input type="checkbox" name="item"/></td><td>3</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="item"/></td><td>2</td>
        </tr>
        <tr>
            <td><input type="checkbox" name="item"/></td><td>1</td>
        </tr>
    </form>
</body>
      </html>

如您所见,如果单击新复选框按钮,则会添加新复选框。还有另一个按钮可以提醒复选框列表的长度。 在Firefox中,您获得了列表的更新长度,但在IE 6和7中,它表示长度仍为3。 你如何在IE中解决这个问题?

2 个答案:

答案 0 :(得分:2)

IE不会让你在创建元素后设置“name”属性:

var n=document.createElement("<input name='item'>");

但是,如果你这样做,它应该有效。

编辑 - 看起来像Firefox(因为FF4,显然从未在标准模式下)不喜欢这样做,所以你必须做一些浏览器嗅探或功能测试来知道它是否用于创建具有类似名称的元素。

答案 1 :(得分:0)

在那些用于创建输入元素的IE版本中,您必须执行以下操作:

document.createElement('<input type="checkbox" name="foo" />');