如何在提交一次后禁用提交按钮



Hi我想在用户提交表单时创建一个函数,刷新页面后该按钮应保持禁用状态。我尝试过这种方法,但只有当我刷新页面时,它才能被访问。

<script>
$('.reverse-form').one('submit', function() {
$(this).find('input[type="submit"]').attr('disabled', 'disabled');
});
</script>

您可以使用能够存储键值对的localStorage。如果本地存储中不存在键值,则返回javascript中具有false布尔值的null,否则任何字符串(空字符串"除外(都具有true布尔值。

此外,我使用了prop而不是attr,因为disabledboolean attribute(就像选中的一样(,在这种情况下,你必须使用prop(否则,使用attr((,你设置或获得defaultChecked属性,即禁用属性的初始值,在这种情况下是相同的,但通常不是这样(

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"
integrity="sha512-aVKKRRi/Q/YV+4mjoKBsE4x3H+BkegoM/em46NNlCqNTmUYADjBbeNefNxYV7giUp0VxICtqdrbqU7iVaeZNXA=="
crossorigin="anonymous"
></script>
</head>
<body>
<form class="reverse-form">
<input type="submit" />
</form>
<script>
if (localStorage.submitDisabilitato) {
$('form.reverse-form input[type="submit"]').prop("disabled", true);
} else {
$(".reverse-form").one("submit", function (e) {
e.preventDefault();
localStorage.submitDisabilitato = "submitDisabilitato";
$(this).find('input[type="submit"]').prop("disabled", true);
});
}
</script>
</body>

最新更新