我希望提交按鈕僅在輸入欄位滿足設定的要求時才呼叫該函式。有沒有比為每個輸入元素創建一個 if 陳述句更簡單的方法？
<div class="container">
<form>
<input id="inputname" type="text" name="name" required placeholder="Your Name">
<input id="email" placeholder="Your E-mail" type="email" name="email" required>
<input id="phone" type="tel" name="phone" pattern="[0-9]{3}-[0-9]{3}-[0-9]{4}" placeholder="123-456-7890" required>
<textarea type="text" rows="4" placeholder="Add comments(optional)" id="comments"></textarea>
<button type="submit" onclick="submitted()"> Reserve a Table</button>
</form>
</div>
<script>
const container = document.querySelector('.container');
function submitted() {
container.innerHTML = `<i ></i><br>
Thank you, the form has been submitted!`
}
</script>
uj5u.com熱心網友回復：
是的。有關表單驗證的更多詳細資訊，請參閱本教程。
特別是，在標題下使用內置表單驗證：
當元素無效時，以下情況為真：
...
如果用戶嘗試發送資料，瀏覽器將阻止表單并顯示錯誤訊息。
另請參閱約束驗證程序下的注釋以了解有關何時發生這種情況的更多資訊。
最初發布的示例顯示在這個小提琴中，但在選擇器的開頭缺少一個點container。
作為這里的解決方案，您可以將函式呼叫移動到表單的 onsubmit 處理程式，而不是提交按鈕的單擊處理程式。該小提琴就在這里，僅包含以下更改的標簽：<form onsubmit="submitted()">和<button type="submit">.
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/453210.html
標籤：javascript html 形式 按钮点击