IE8+ innerHTML 兼容性問題：document.all 棄用與 Form 嵌套 Table 導致表單字段丟失

問題現象

JS 動態生成輸入框插入 <td id="PicUp">，IE11 下提交表單無法獲取動態添加的字段值。

兩大根因

1. 使用廢棄 document.all：IE11 不再支持，應改用 document.getElementById('PicUp')。
2. <form> 直接包裹 <table> 導致 DOM 解析異常：瀏覽器會將 <form> 提升至 <table> 之外，導致動態插入的 <input> 不在表單內，提交時丟失。

修正代碼

JS 部分

function setid() {
    var str = '';
    if (!document.editForm.UrlVolume.value) document.editForm.UrlVolume.value = 1;
    for (var i = 1; i <= document.editForm.UrlVolume.value; i++) {
        if (document.editForm.UrlVolume.value < 100) {
            str += '<input type="text" name="PicUrl' + i + '" value="0' + i + '" class="textfield" style="width:240px;" title="圖片地址">&nbsp;';
            str += '<input type="text" name="PicName' + i + '" value="包裝" class="textfield" style="width:100px;" title="中文描述">&nbsp;';
            str += '<input type="text" name="PicNameEn' + i + '" value="English' + i + '" class="textfield" style="width:100px;" title="英文描述">&nbsp;';
            str += '<a href="javascript:OpenScript(\'UpFileForm.asp?Result=PicUrl' + i + '\',460,180)"><img src="images/upfile.gif" width="44" height="22" border="0" align="absmiddle"></a><br>';
        }
    }
    document.getElementById('PicUp').innerHTML = str; // 替換 document.all.PicUp
}

HTML 結構調整

<form name="editForm" method="post" action="?Action=SaveEdit&Result=Modify&ID=5">
    <table>
        <tr height="28">
            <td rowspan="3" width="200">更多圖片：</td>
            <td>
                <input name="UrlVolume" type="text" size="2" class="textfield" maxlength="2"> 張
                <input type="button" name="SubmitUrl" onclick="setid();" value="設定" class="button"> 輸入數量後點設定
            </td>
        </tr>
        <tr>
            <td id="PicUp" class="forumRowHighlight"></td>
        </tr>
        <tr>
            <td>&nbsp;</td>
            <td><input name="submitSaveEdit" type="submit" id="submitSaveEdit" value="保存"></td>
        </tr>
    </table>
</form>

最佳實踐

• 永遠用 document.getElementById 或 querySelector 獲取元素。
• <form> 應包裹 <table>，而非反過來；或將表單放在單元格內。
• 動態生成表單字段後，按 F12 檢查 DOM 結構確認字段在 <form> 內部。