Как отключить/разрешить поле ввода при щелчке с помощью jQuery

Question

Как правильно включить/отключить поле ввода при щелчке с помощью jQuery?

Я экспериментировал с:

$("#FullName").removeAttr('disabled'); 

, который удаляет disabled="disabled" из этого поля ввода:

<input id="FullName" style="width: 299px" value="Marko" disabled="disabled" /> 

Но как добавить его снова нажмите на другую кнопку или, как отключить поле ввода по щелчку ?

Answer 1

Для JQuery версии 1.6+ использовать prop:

$('#elementId').click(function(){ 
     $('#FullName').prop('disabled', true\false); 
}); 

Для более старых версий JQuery использовать attr:

$('#elementId').click(function(){ 
     $('#FullName').attr('disabled', 'disabled'\''); 
}); 

Answer 2

$("#FullName").prop('disabled', true); 

сделаю.

Но имейте ввиду, что после его отключения (по приведенному выше коду) onclick обработчик не будет работать как отключенный. Чтобы включить его, добавьте $("#FullName").removeAttr('disabled'); в обработчик onclick другой кнопки или поля.

Answer 3

Это должно быть сделано.

$("#FullName").attr('disabled', 'disabled'); 

Shiplu правильно, но использовать это, если вы не используете JQuery 1.6+

Answer 4

$("#anOtherButton").click(function(){ 
    $("#FullName").attr('disabled', 'disabled'); 
}); 

• .attr(attributeName, value) function

  установить один или несколько атрибутов для набора соответствующих элементов

Answer 5

$('#checkbox-id').click(function() 
{ 
    //If checkbox is checked then disable or enable input 
    if ($(this).is(':checked')) 
    { 
     $("#to-enable-input").removeAttr("disabled"); 
     $("#to-disable-input").attr("disabled","disabled"); 
    } 
    //If checkbox is unchecked then disable or enable input 
    else 
    { 
     $("#to-enable-input").removeAttr("disabled"); 
     $("#to-disable-input").attr("disabled","disabled"); 
    } 
}); 

Answer 6

еще один простой способ, чтобы включить/отключить входной Фейлд

$("#anOtherButton").click(function() { 
 
    $("#FullName").attr('disabled', !$("#FullName").attr('disabled')); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> 
 

 
<input id="FullName" style="width: 299px" value="Marko" disabled="disabled" /> 
 
<br> 
 
<br> 
 
<input type="button" id="anOtherButton" value="disable/enable" />

Answer 7

Для переключения поля между инвалидами и включен, попробуйте следующее:

$('#toggle_button').click(function() { 
    $('#FullName').prop("disabled", 

    function (i, val) { 
     return !val; 
    }); 
})