Отключение и включение кнопки ввода html

250

Итак, у меня есть кнопка, как это:

<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/>

Как я могу отключить и включить его, когда я хочу? Я пытался, disabled="disable"но включить его обратно это проблема. Я попытался установить его обратно в false, но это не позволило.

javascript jquery

— k.ken
источник

Что вы имеете в виду включить его обратно? Как только вы отключите его, вы не сможете снова включить его тем же способом, который, Me()я надеюсь, вы знаете (потому что он отключен)

— cjds

2

Я пытаюсь отключить и включить кнопку, когда происходят определенные события.

— k.ken

461

Используя Javascript

Отключение кнопки HTML

document.getElementById("Button").disabled = true;

Включение кнопки HTML

document.getElementById("Button").disabled = false;

Демо Здесь

Использование jQuery

Все версии jQuery до 1.6

Отключение кнопки HTML

$('#Button').attr('disabled','disabled');

Включение кнопки HTML
```
$('#Button').removeAttr('disabled');
```
Демо Здесь

Все версии jQuery после 1.6

Отключение кнопки HTML
```
$('#Button').prop('disabled', true);
```
Включение кнопки HTML
```
$('#Button').prop('disabled', false);
```
Демо Здесь

PS Обновил код на основе изменений jquery 1.6.1 . В качестве предложения всегда используйте последние файлы jquery и prop()метод.

— palaѕн
источник

Нужны ли там атрибуты, чтобы это работало? like disables = "disable"

— k.ken

Нет, внутри $(document).readyможно позвонить $('#Button').attr('disabled','disabled');. Это отключит кнопку загрузки страницы. И когда происходят определенные события, вы можете позвонить, $('#Button').removeAttr('disabled');чтобы включить его снова ...

— palaѕн

Как добавить серый стиль, если отключен?

— Лэй Ян

1

@LeiYang вы можете добавить некоторые CSS, как это

— palaѕн

Просто обратите внимание, что true и false являются логическими значениями, а не строками, как правильно написал Палаш

— Марко

24

Так как вы отключаете его в первую очередь, способ включить его - установить его disabledсвойство как false.

Чтобы изменить его disabledсвойство в Javascript, вы используете это:

var btn = document.getElementById("Button");
btn.disabled = false;

И, очевидно, чтобы отключить его снова, вы бы использовали trueвместо этого.

Поскольку вы также пометили вопрос с помощью jQuery, вы можете использовать этот .propметод. Что-то вроде:

var btn = $("#Button");
btn.prop("disabled", true);   // Or `false`

Это в более новых версиях jQuery. Более старый способ сделать это - добавить или удалить атрибут, например, так:

var btn = $("#Button");
btn.attr("disabled", "disabled");
// or
btn.removeAttr("disabled");

Простое присутствие disabledсвойства отключает элемент, поэтому вы не можете установить его значение как «false». Даже следующее должно отключить элемент

<input type="button" value="Submit" disabled="" />

Вам нужно либо полностью удалить атрибут, либо установить его свойство.

— Ян
источник

что если я хочу, чтобы кнопка была включена сначала, а потом отключена; Я также попробовал enable = "true". Это правильное ключевое слово?

— k.ken

2

@ k.ken Нет, ключевое слово "отключено". Если вы хотите, чтобы кнопка была включена изначально, не вставляйте атрибут disabledвообще. Просто используйте <input type="button" value="Submit" />. А при изменении статуса используйте .prop("disabled", true);(или false)

— Ян

10

Вы можете сделать это довольно просто с помощью простого JavaScript, библиотеки не требуются.

Включить кнопку

document.getElementById("Button").disabled=false;

Отключить кнопку

 document.getElementById("Button").disabled=true;

Внешние библиотеки не нужны.

— Джон
источник

4

Атрибут disable имеет только один параметр. если вы хотите включить его, вы должны удалить все, а не просто изменить значение.

— Я боролся с медведем один раз.
источник

3

$(".btncancel").button({ disabled: true });

Здесь 'btncancel' - имя класса кнопки.

— Хамид Н.К.
источник

0

Без jQuery отключить ввод будет проще

Button.disabled=1;

Показать фрагмент кода

function dis() {
  Button.disabled= !Button.disabled;
}

<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/>

<button onclick="dis()">Toggle disable</button>

Развернуть фрагмент

— Камил Келчевски
источник

0

 <!--Button Disable Script-->
    <script type="text/javascript">
        function DisableButton() {
            document.getElementById("<%=btnSave.ClientID %>").disabled = true;
        }
        window.onbeforeunload = DisableButton;
    </script>
    <!--Button Disable Script-->

— JIYAUL MUSTAPHA
источник

-2

Это обязательно сработает.

Отключить кнопку

$('#btn_id').button('disable');

Включить кнопку

$('#btn_id').button('enable');

— Shalika
источник

-6

Придерживайтесь php ...

Почему бы не позволить кнопке появляться только при соблюдении вышеуказанных критериев.

<?
if (whatever == something) {
    $display = '<input id="Button" type="button" value="+" style="background-color:grey" onclick="Me();"/>';
    return $display;
}
?>

— Моя чайка на колесах
источник