jQuery로 입력을 비활성화 / 활성화 하시겠습니까?

$input.disabled = true;

또는

$input.disabled = "disabled";

어떤 표준 방법입니까? 반대로, 비활성화 된 입력을 어떻게 활성화합니까?

jQuery 1.6 이상

disabled속성 을 변경하려면 .prop()함수를 사용해야합니다 .

$("input").prop('disabled', true);
$("input").prop('disabled', false);

jQuery 1.5 이하

이 .prop()함수는 존재 .attr()하지 않지만 비슷합니다.

disabled 속성을 설정하십시오.

$("input").attr('disabled','disabled');

다시 활성화하려면 올바른 방법을 사용하는 것입니다 .removeAttr()

$("input").removeAttr('disabled');

모든 버전의 jQuery

항상 실제 DOM 객체에 의존 할 수 있으며 하나의 요소 만 처리하는 경우 다른 두 옵션보다 약간 빠릅니다.

// assuming an event handler thus 'this'
this.disabled = true;

.prop()또는 .attr()메소드 를 사용하면 선택된 여러 항목에 대해 속성을 설정할 수 있다는 장점이 있습니다.

참고 : 1.6 에는와.removeProp() 비슷한 방법이 removeAttr()있지만 설명서의 Excerpt 와 같은 기본 속성에는 사용하지 않아야'disabled' 합니다.

참고 :이 방법을 사용하여 확인, 비활성화 또는 선택과 같은 기본 속성을 제거하지 마십시오. 이렇게하면 속성이 완전히 제거되고 일단 제거되면 요소에 다시 추가 할 수 없습니다. 대신 .prop ()를 사용하여 이러한 속성을 false로 설정하십시오.

사실, 나는이 방법에 대해 많은 합법적 인 사용이 의심된다. ​​부울 소품은 1.5의 "속성"과 같이 "제거"하는 대신 거짓으로 설정해야한다.

ECMA6 (????)로 상황이 크게 바뀌지 않는 한 새로운 컨벤션을 위해 & 앞으로 계속 적응할 수 있도록 만들기 위해 :

$(document).on('event_name', '#your_id', function() {
    $(this).removeAttr('disabled');
});

과

$(document).off('event_name', '#your_id', function() {
    $(this).attr('disabled','disabled');   
});

    // Disable #x
    $( "#x" ).prop( "disabled", true );
    // Enable #x
    $( "#x" ).prop( "disabled", false );

입력 또는 텍스트 영역과 같은 양식 요소를 비활성화 / 활성화해야하는 경우가 있습니다. Jquery를 사용하면 disabled 속성을 "disabled"로 설정하여 쉽게 만들 수 있습니다. 예를 들어 :

  //To disable 
  $('.someElement').attr('disabled', 'disabled');

비활성화 된 요소를 활성화하려면이 요소에서 "disabled"특성을 제거하거나 문자열을 비워야합니다. 예를 들어 :

//To enable 
$('.someElement').removeAttr('disabled');

// OR you can set attr to "" 
$('.someElement').attr('disabled', '');

참조 : http://garmoncheg.blogspot.fr/2011/07/how-to-disableenable-element-with.html

$("input")[0].disabled = true;

또는

$("input")[0].disabled = false;

코드의 전역 어딘가에 넣을 수 있습니다.

$.prototype.enable = function () {
    $.each(this, function (index, el) {
        $(el).removeAttr('disabled');
    });
}

$.prototype.disable = function () {
    $.each(this, function (index, el) {
        $(el).attr('disabled', 'disabled');
    });
}

그리고 다음과 같이 쓸 수 있습니다.

$(".myInputs").enable();
$("#otherInput").disable();

토글 버튼 동작과 같은 현재 상태를 반전하려는 경우 :

$("input").prop('disabled', ! $("input").prop('disabled') );

요소를 사용하거나 사용하지 않도록 설정할 수있는 방법에는 여러 가지가 있습니다 .

접근법 1

$("#txtName").attr("disabled", true);

접근법 2

$("#txtName").attr("disabled", "disabled");

jQuery 1.7 이상 버전을 사용하는 경우 attr () 대신 prop ()를 사용하십시오.

$("#txtName").prop("disabled", "disabled");

요소를 활성화하려면 비활성화하기 위해 수행 한 작업과 반대로해야합니다. 그러나 jQuery는 속성을 제거하는 다른 방법을 제공합니다.

접근법 1

$("#txtName").attr("disabled", false);

접근법 2

$("#txtName").attr("disabled", "");

접근법 3

$("#txtName").removeAttr("disabled");

jQuery 1.7 이상을 사용하는 경우 attr () 대신 prop ()를 사용하십시오. 그렇습니다. 이것은 jQuery를 사용하여 요소를 활성화하거나 비활성화하는 방법입니다.

2018 년 업데이트 :

이제이 jQuery를 필요가 없습니다 그리고 그것은을하고있는 동안 이후 document.querySelector 또는 document.querySelectorAll거의 정확히 같은 일을 할 (여러 요소) $ 플러스 더 명시 것과 같은 getElementById, getElementsByClassName,getElementsByTagName

"입력 확인란"클래스의 한 필드 비활성화

document.querySelector('.input-checkbox').disabled = true;

또는 여러 요소

document.querySelectorAll('.input-checkbox').forEach(el => el.disabled = true);

jQuery prop () 메소드를 사용하여 jQuery를 사용하여 양식 요소를 제어하거나 동적으로 제어 할 수 있습니다. prop () 메소드에는 jQuery 1.6 이상이 필요합니다.

예:

<script type="text/javascript">
        $(document).ready(function(){
            $('form input[type="submit"]').prop("disabled", true);
            $(".agree").click(function(){
                if($(this).prop("checked") == true){
                    $('form input[type="submit"]').prop("disabled", false);
                }
                else if($(this).prop("checked") == false){
                    $('form input[type="submit"]').prop("disabled", true);
                }
            });
        });
    </script>

비활성화 :

$('input').attr('readonly', true); // Disable it.
$('input').addClass('text-muted'); // Gray it out with bootstrap.

사용 :

$('input').attr('readonly', false); // Enable it.
$('input').removeClass('text-muted'); // Back to normal color with bootstrap.

입력 유형에 대해 true를 비활성화하십시오.

특정 입력 유형의 경우 ( 예 : 텍스트 유형 입력 )

$("input[type=text]").attr('disabled', true);

모든 유형의 입력 유형

$("input").attr('disabled', true);

이것은 나를 위해 작동

$("#values:input").attr("disabled",true);
$("#values:input").attr("disabled",false);

@ gnarf 답변을 사용하고 함수로 추가했습니다.

   $.fn.disabled = function (isDisabled) {
     if (isDisabled) {
       this.attr('disabled', 'disabled');
     } else {
       this.removeAttr('disabled');
     }
   };

그런 다음 이렇게 사용하십시오

$('#myElement').disable(true);

JQuery가없는 2018 (ES6)

모두 비활성화 input:

[...document.querySelectorAll('input')].map(e => e.disabled = true);

안 input와id="my-input"

document.getElementById('my-input').disabled = true;

문제는 JQuery 와 관련 이 있으며 단지 FYI입니다.

접근법 4 (이것은 와일드 코더 답변의 확장입니다 )

txtName.disabled=1     // 0 for enable

<input id="txtName">

이렇게 사용하십시오

 $( "#id" ).prop( "disabled", true );

 $( "#id" ).prop( "disabled", false );

<html>
<body>

Name: <input type="text" id="myText">



<button onclick="disable()">Disable Text field</button>
<button onclick="enable()">Enable Text field</button>

<script>
function disable() {
    document.getElementById("myText").disabled = true;
}
function enable() {
    document.getElementById("myText").disabled = false;
}
</script>

</body>
</html>

jQuery Mobile에서 :

비활성화

$('#someselectElement').selectmenu().selectmenu('disable').selectmenu('refresh', true);
$('#someTextElement').textinput().textinput('disable');

활성화

$('#someselectElement').selectmenu().selectmenu('enable').selectmenu('refresh', true);
$('#someTextElement').textinput('enable');