Mat*_*tor 8 javascript jquery doctype internet-explorer dom
我目前正在与一个IE JavaScript/DOM bug(很有趣)进行斗争,这真的让我很难过.有问题的代码会将一些复选框复制到一个表单中,并需要保持其已检查状态.问题是,IE(特别是IE8,虽然我也猜测其他人)不想这样做.
我已经将bug本身缩小到一个非常小的测试用例.基本上,在页面上没有DOCTYPE的情况下工作正常,但是当DOCTYPE存在时它们会被破坏.我本来期望相反,但谁知道IE.
以下是最简单的测试用例.对于每个人:在IE中打开页面,切换复选框,然后单击"TEST".
<input type="checkbox" id="broken">
<button id="break">TEST</button>
<script>
document.getElementById('break').onclick = function() {
alert(document.getElementById('broken').outerHTML);
};
</script>
Run Code Online (Sandbox Code Playgroud)
<!DOCTYPE html>
<input type="checkbox" id="broken">
<button id="break">TEST</button>
<script>
document.getElementById('break').onclick = function() {
alert(document.getElementById('broken').outerHTML);
};
</script>
Run Code Online (Sandbox Code Playgroud)
错误发生在有效页(与<html>
,<head>
,<body>
等)和输入是否是一个形式的内部.在"破碎"的情况下,outerHTML总是反映页面加载时出现的内容(如果我默认选中了输入,那么即使我首先取消选中它,它总是使用CHECKED警告代码).如果我包装输入并使用innerHTML,事情就会以同样的方式发生.在实际的网站上我使用jQuery的.clone()方法进行复制; .clone()在内部使用.outerHTML,这就是我缩小范围的方法.
我的问题是:有没有办法自己手动构建新的HTML?有没有人知道为什么会发生这种情况(除了"IE SUX LOLZ"之外)?
有一般问题,与innerHTML
和表单属性.不只是在IE中((在FF中更糟糕,它永远不会更新innerHTML中的checked属性))...
您可以尝试这个来解决链接问题中的问题:
document.getElementById('break').onclick = function() {
var broken = document.getElementById('broken');
if (broken.checked) broken.setAttribute('checked','checked');
else broken.removeAttribute('checked');
alert(broken.outerHTML);
};
Run Code Online (Sandbox Code Playgroud)
归档时间: |
|
查看次数: |
3538 次 |
最近记录: |