它是一個簡單的表單,帶有一個應該轉到“nextPage.html”的操作。它只有 1 個輸入,即復選框和提交按鈕。
const form = document.getElementById('form')
const checkbox = document.getElementById('checkbox')
const message = document.getElementById('message')
form.addEventListener('submit', function validateCheckbox(e) {
e.preventDefault()
if (checkbox.checked === true) {
message.innerHTML = 'Done'
}
else {
message.innerHTML = 'Please check the box to continue!'
}
})
<div class="container">
<form method="post" action="nextPage.html" id="form">
<label for="checkbox">By continuing, I agree that I have read and understand the terms of service.</label> <br>
<input type="checkbox" id="checkbox">
<button type="submit">Submit</button>
<h5 id="message"></h5>
</form>
</div>
uj5u.com熱心網友回復:
e.currentTarget.submit();在您確認復選框被選中后,將“手動”提交表單。另外請注意,始終建議包含分號行終止。
const form = document.getElementById('form');
const checkbox = document.getElementById('checkbox');
const message = document.getElementById('message');
form.addEventListener('submit', function validateCheckbox(e) {
e.preventDefault();
if (checkbox.checked === true) {
message.innerHTML = 'Done';
e.currentTarget.submit();
} else {
message.innerHTML = 'Please check the box to continue!';
}
})
<div class="container">
<form method="post" action="nextPage.html" id="form">
<label for="checkbox">By continuing, I agree that I have read and understand the terms of service.</label> <br>
<input type="checkbox" id="checkbox">
<button type="submit">Submit</button>
<h5 id="message"></h5>
</form>
</div>
轉載請註明出處,本文鏈接:https://www.uj5u.com/qiye/497728.html
標籤:javascript 形式 提交按钮
