2017年6月27日 星期二

[JS]網頁學習 第二章 JS Forms, Forms API 小節 心得小記

說明、舉例驗證 user input,避免無填入或範圍外的數值,
這裡提到經常使用在檢驗數字。

輸入錯誤可選擇顯示跳出視窗,或是在 input 附近提示。
驗證無填入、跳出視窗:

<script>
function validateForm() {
    var x = document.forms["myForm"]["fname"].value;
    if (x == "") {
        alert("Name must be filled out");
        return false;
    }
}
</script>
</head>
<body>

<form name="myForm" action="/action_page_post.php"
onsubmit="return validateForm()" method="post">
Name: <input type="text" name="fname">
<input type="submit" value="Submit">
</form>


</body>

以上畫紅字不懂:
1. 為何不可刪除 ["myForm"]?
2. 輸入 false 是為了停止繼續執行?
3. 可以使用 onclick 嗎?

試著將var x 改為常用的 getElementById("fname")、
onsubmit 改為 onclick 並移至 input type="submit" 中,
完全錯誤不驗證跳下一頁!why~

另外,document.forms[][] 好像是第一次出現,留意一下這個句型。

沒有留言:

張貼留言