Отключение кнопки после однократного нажатия
Мне нужно отключить кнопку, как только она щелкнула, чтобы пользователь не мог щелкнуть ее более одного раза. (Мое приложение написано в MVC ASP.NET, я сделал это в обычном приложении ASP.NET.)
Я пробовал использовать JavaScript и jQuery, и он не работает. Кнопка отключается, но форма не отправляется.
JQuery
$("#ClickMe").attr("disabled", "disabled");
JavaScript:
function DisableNextButton(btnId) {
document.getElementById(btnId).disabled = 'true';
}
Оба метода работают отлично, но теперь форма не будет отправляться.
Ответы
Ответ 1
jQuery теперь имеет функцию .one()
, которая ограничивает любое заданное событие (например, "отправить" ) на одно вхождение.
Пример:
$('#myForm').one('submit', function() {
$(this).find('input[type="submit"]').attr('disabled','disabled');
});
Этот код позволит вам отправить форму один раз, а затем отключить кнопку. Измените селектор в функции find() на любую кнопку, которую вы хотите отключить.
Примечание. В пользу Франсиско Голденштейна, я изменил селектор на форму и тип события для отправки. Это позволяет вам отправить форму из любого места (места, отличного от кнопки), в то же время отключив кнопку отправки.
Примечание 2: В gorelog, используя attr('disabled','disabled')
, вы не сможете отправить форму в форме кнопки отправки. Если вы хотите передать значение кнопки, используйте attr('onclick','this.style.opacity = "0.6"; return false;')
вместо этого.
Ответ 2
Если при отключенном отключении = "отключен" сразу после нажатия пользователем кнопки, и форма не отправляется из-за этого, вы можете попробовать две вещи:
//First choice [given myForm = your form]:
myInputButton.disabled = "disabled";
myForm.submit()
//Second choice:
setTimeout(disableFunction, 1);
//so the form will submit and then almost instantly, the button will be disabled
Хотя я честно ставлю, что будет лучший способ сделать это, чем это.
Ответ 3
jQuery .one()
не следует использовать с событием click, но с событием submit
, как описано ниже.
$('input[type=submit]').one('submit', function() {
$(this).attr('disabled','disabled');
});
Ответ 4
$("selectorbyclassorbyIDorbyName").click(function () {
$("selectorbyclassorbyIDorbyName").attr("disabled", true).delay(2000).attr("disabled", false);
});
выберите кнопку и ее идентификатор или текст или класс... он просто отключается после 1-го щелчка и включает через 20 миллисекунд
Хорошо работает для post backs n, размещая его на главной странице, применительно ко всем кнопкам, не вызывающим неявно, как onclientClick
Ответ 5
protected void Page_Load(object sender, EventArgs e)
{
// prevent user from making operation twice
btnSave.Attributes.Add("onclick",
"this.disabled=true;" + GetPostBackEventReference(btnSave).ToString() + ";");
// ... etc.
}
Ответ 6
Используйте современные события Js, с "один раз"!
const button = document.getElementById(btnId);
button.addEventListener("click", function() {
// Submit form
}, {once : true});
// Disabling works too, but this is a more standard approach for general one-time events
Документация, CanIUse
Ответ 7
думать просто
<button id="button1" onclick="Click();">ok</button>
<script>
var buttonClick = false;
function Click() {
if (buttonClick) {
return;
}
else {
buttonClick = true;
//todo
alert("ok");
//buttonClick = false;
}
}
</script>
если вы хотите запустить один раз:)
Ответ 8
Чтобы отключить кнопку отправки, вам просто нужно добавить отключенный атрибут к кнопке отправки.
$("#btnSubmit").attr("disabled", true);
Чтобы включить отключенную кнопку, установите для отключенного атрибута значение false или удалите отключенный атрибут.
$('#btnSubmit').attr("disabled", false);
или
$('#btnSubmit').removeAttr("disabled");