jQuery를 사용하여 입력을 비활성화/활성화하시겠습니까?

jQuery를 사용하여 입력을 비활성화/활성화하시겠습니까?

$input.disabled = true;

또는

$input.disabled = "disabled";

표준적인 방법은 무엇입니까?반대로 비활성화된 입력을 활성화하려면 어떻게 해야 합니까?

jQuery 1.6 이상

를 변경하려면disabled기능을 사용해야 합니다.

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

jQuery 1.5 이하

그.prop()함수는 존재하지 않지만 유사합니다.

디세이블 속성을 설정합니다.

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

다시 활성화하려면 다음 방법을 사용합니다.

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

모든 버전의 jQuery

항상 실제 DOM 오브젝트에 의존할 수 있습니다.또, 다음의 1개의 요소만을 취급하는 경우는, 다른 2개의 옵션보다 조금 빠를 가능성이 있습니다.

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

를 사용하는 장점.prop()또는.attr()메서드는 선택한 항목 집합의 속성을 설정할 수 있습니다.

---

주의: 1.6에는 다음과 같은 방법이 있습니다.removeAttr()단, 다음과 같은 네이티브 속성에서는 사용하지 마십시오.'disabled'매뉴얼 발췌:

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

실제로 이 메서드에 대한 정당한 용도는 많지 않습니다.부울 소품은 1.5의 "속성" 소품처럼 "삭제"하지 말고 false로 설정해야 합니다.

단지 새로운 규약을 위해, 그리고 향후에 적응할 수 있도록 하기 위해서(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를 사용하면 비활성 속성을 "비활성화"로 설정하여 쉽게 만들 수 있습니다.예:

  //To disable 
  $('.someElement').attr('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;

이러한 요소를 사용하면 여러 가지 방법으로 요소를 활성화/비활성화할 수 있습니다.

어프로치 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를 사용하여 요소를 활성화 또는 비활성화합니다.

이렇게 하면

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

 $( "#id" ).prop( "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') );

이거면 돼

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

2018년 업데이트:

【jQuery】는 꽤 .document.querySelector ★★★★★★★★★★★★★★★★★」document.querySelectorAll요소의 와 거의 합니다. 게다가 인 작업(예: 요요요복복복복복복와와) $와와와와와 와와와와 ( ( ( ( ( ( ( ( ( ( ( ( ( ( ( ( 。getElementById,getElementsByClassName,getElementsByTagName

"input-checkbox" 클래스의 한 필드 비활성화

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를 사용하지 않도록 설정합니다.

특정 입력 타입의 경우(Ex). 텍스트 유형 입력)

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

모든 유형의 입력에 대하여

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

입력 필드를 비활성화하는 다른 방법은 다음과 같이 jQuery 및 css를 사용하는 것입니다.

jQuery("#inputFieldId").css({"pointer-events":"none"})

같은 입력을 유효하게 하기 위한 코드는 다음과 같습니다.

jQuery("#inputFieldId").css({"pointer-events":""})

<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>

@gnarf answer를 사용하여 기능으로 추가했습니다.

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

그럼 이렇게 쓰세요.

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

2018년, JQuery 없음(ES6)

「」를 무효로 합니다.input:

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

「」를 무효로 .inputid="my-input"

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

질문은 JQuery에 관한 것입니다.그냥 참고입니다.

어프로치 4(이것은 와일드 코더의 답변의 확장)

txtName.disabled=1     // 0 for enable

<input id="txtName">

jQuery Mobile의 경우:

디세이블의 경우

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

유효하게 하다

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

언급URL : https://stackoverflow.com/questions/1414365/disable-enable-an-input-with-jquery