Question

我通过在div中设置innerHTML来创建动态复选框。这个复选框上有onclick事件。该代码在除IE8之外的所有浏览器中都能正常工作。

在设置innerHTML后，IE似乎没有绑定事件。有没有办法重新绑定事件？

以下是innerHTML代码。

<INPUT id=Animal onclick=\"updateHTML();\" name=Control value=Animal type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">
<INPUT id=Food onclick=\"updateHTML();\" name=Control value=Food type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">

以下是完整的代码

<HTML>
<HEAD>
    <SCRIPT>
        function updateHTML()
        {
            alert('updateHTML');
        }
        function changeEvent()
        {
            var innerhtml="\r\n<TBODY id=originalDiv><TR>\r\n<TD title=\"\">\r\n<INPUT id=Animal onclick=\"updateHTML();\" name=Control value=Animal type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">Animal\r\n<INPUT id=Food onclick=\"updateHTML();\" name=Control value=Food type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">Food\r\n</TD></TR></TBODY>";
            var originalDiv=document.getElementById('originalDiv');
            var temp = originalDiv.ownerDocument.createElement('div');
            temp.innerHTML = '<table>' + innerhtml + '</table>';
            originalDiv.replaceChild(temp.firstChild, originalDiv.firstChild);
        }
    </SCRIPT>
</HEAD>
<BODY>
    <TABLE>
        <TBODY id ="originalDiv">
            <TR>
                <TD vAlign=middle>
                    <INPUT id=Bird onclick=\"updateHTML();\" name=Control value=Bird type=checkbox uncheckedValue=\"0\" checkedValue=\"1\">Bird
                </TD>
            </TR>
        </TBODY>
        <TBODY id="submit">
            <TR>
                <TD>
                    <input type=button value="Submit" onclick="changeEvent()">
                </TD>
            </TR>
        </TBODY>
    </TABLE>
<BODY>

Answer 1

首先，你应该解决这个问题：

添加doctype。这对IE来说非常重要
在文档末尾添加html结束标记
关闭所有输入标记，如下所示：

<input type="checkbox" id="Bird" value="1" />

如果您使用非html属性，请使用“data-”前缀：

<input type="checkbox" id="Bird" value="1" data-unckecked-value="0" data-checked-value="1" />

在Javascript中替换innerHTML后，onClick事件复选框在IE中不起作用

1 个答案: