JavaScript 客戶端驗證：手動修改函數返回值需重新整理頁面才生效

現象

在瀏覽器開發者工具中手動將 check() 返回值從 true 改為 false，點擊提交按鈕仍跳轉頁面；重新整理後才生效。

原因

瀏覽器已載入並編譯原始 JS 程式碼。你在 Console 中修改的是執行時期的函數物件，但事件處理器（onsubmit="return check()"）綁定的是原始函數參考。重新整理會重新解析 HTML 與 JS，綁定更新後的函數。

正確驗證方式

function check() {
    var name = document.getElementById('username').value;
    if (!name) { alert('請輸入用戶名'); return false; }
    // 其他驗證...
    return true;
}

實際專案中，驗證邏輯根據表單輸入動態計算返回值，而非人工修改原始碼。

補充：現代最佳實踐

• 使用 addEventListener('submit', ...) 取代內聯 onsubmit。
• 配合 HTML5 表單驗證屬性（required, pattern）減少 JS 代碼。
• 考慮使用驗證庫（如 Validator.js、Yup）。