JavaScript 文本框賦值不生效：input 不支持 onload，必須用 window.onload 與 .value

問題代碼

<input type="text" id="Text1" onload="showdata()" />
<script>
function showdata() {
    var str = ...;
    document.getElementById("Text1").innerText = str; // 錯誤
    // document.getElementById("Text1").innerHtml = str; // 錯誤
    // document.getElementById("Text1").value = str; // 正確但未生效，因函數未執行
}
</script>

根因分析

1. <input> 元素**不觸發 onload 事件**，導致 showdata() 永不調用。
2. 即便調用，innerText/innerHTML 對輸入框無效，必須使用 .value。
3. 腳本位置若在 <head> 且無延遲，DOM 尚未就緒，getElementById 返回 null。

標準修正模板

<input type="text" id="Text1" />

<script>
function setCurrentDate() {
    var d = new Date();
    var fmt = d.getFullYear() + '-' + (d.getMonth()+1).toString().padStart(2,'0') 
              + '-' + d.getDate().toString().padStart(2,'0');
    document.getElementById('Text1').value = fmt;
}
// 方式一：傳統 onload
window.onload = setCurrentDate;

// 方式二：現代 DOMContentLoaded（推薦，不等待圖片/樣式）
document.addEventListener('DOMContentLoaded', setCurrentDate);
</script>

調試技巧

• F12 Console 輸入 document.getElementById('Text1') 驗證元素是否存在。
• 在函數首行加 console.log('setCurrentDate called') 確認執行。
• 檢查是否有其他腳本覆蓋 window.onload（後賦值者勝出）。