加載微調器禁用 HTML5 必需屬性

Question

我有提交按鈕（引導程序），我將一些數據從輸入字段提交到我的 PHP 查詢。 在用戶單擊該按鈕后，我向該提交按鈕添加了一個加載微調器。 由於我已將微調器 ID 添加到按鈕，因此“必需”的 HTML 屬性不再起作用。 它不再向用戶指示丟失的信息。

例子：

 $(document).ready(function() { $("#load").click(function() { // disable button $(this).prop("disabled", true); // add spinner to button $(this).html( `<i class="spinner-border spinner-border-sm mb-1"></i> Loading` ); $("#save").submit(); }); });

 <form method="post" action="" id="save"> <input class="input" name="passwort" type="password" placeholder="Enter your password here" required> </input> <button type="submit" class="btn btn-lg btn-primary" id="load"> Save </button> </form>

Answer 1

也許你應該聽提交事件而不是點擊？

 $(document).ready(function() { $("#save").submit(function(e) { // disable button $('#load').prop("disabled", true); // add spinner to button $('#load').html( `<i class="spinner-border spinner-border-sm mb-1"></i> Loading` ); }); });

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <form method="post" action="" id="save"> <input class="input" name="passwort" type="password" placeholder="Enter your password here" required> </input> <button type="submit" class="btn btn-lg btn-primary" id="load"> Save </button> </form>