Pengesahan Borang Bootstrap 5
Pengesahan Borang
Anda boleh menggunakan kelas pengesahan yang berbeza untuk memberikan umpan balik yang berharga kepada pengguna. Sila tambahkan .was-validated atau .needs-validation tambahkan ke elemen <form> yang mana, bergantung apakah anda ingin memberikan umpan balik pengesahan sebelum atau selepas menghantar borang. Bidang input akan mempunyai garisan pinggir hijau (berkuasa) atau merah (tidak berkuasa) untuk menunjukkan kandungan yang kurang di dalam borang. Anda juga boleh tambah .valid-feedback atau .invalid-feedback mesej, untuk memberitahu pengguna dengan jelas apa yang kurang, atau apa yang perlu selesai sebelum menghantar borang.
contoh
Dalam contoh ini, kami menggunakan .was-validated 来指示缺少什么：
<form action="/action_page.php" class="was-validated">
<div class="mb-3 mt-3">
<label for="uname" class="form-label">用户名：</label>
<input type="text" class="form-control" id="uname" placeholder="请输入用户名" name="uname" required>
<div class="valid-feedback">有效的。</div>
<div class="invalid-feedback">请填写此字段。</div>
</div>
<div class="mb-3">
<label for="pwd" class="form-label">密码：</label>
<input type="password" class="form-control" id="pwd" placeholder="请输入密码" name="pswd" required>
<div class="valid-feedback">有效的。</div>
<div class="invalid-feedback">请填写此字段。</div>
</div>
<div class="form-check mb-3">
<input class="form-check-input" type="checkbox" id="myCheck" name="remember" required>
<label class="form-check-label" for="myCheck">我同意这些条款。</label>
<div class="valid-feedback">有效的。</div>
<div class="invalid-feedback">选中此复选框以继续。</div>
</div>
<button type="submit" class="btn btn-primary">提交</button>
</form>
