Отключение кнопки после однократного нажатия

Мне нужно отключить кнопку, как только она щелкнула, чтобы пользователь не мог щелкнуть ее более одного раза. (Мое приложение написано в 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");