codememo

Javascript를 사용하여 비활성화된 특성을 입력 요소에 추가합니다.

tipmemo 2023. 7. 27. 22:01
반응형

Javascript를 사용하여 비활성화된 특성을 입력 요소에 추가합니다.

입력 상자를 가지고 있으며 양식을 이식할 때 문제가 발생하지 않도록 사용하지 않도록 설정하고 동시에 숨기려고 합니다.

지금까지 입력한 내용을 숨길 수 있는 코드는 다음과 같습니다.

$(".shownextrow").click(function() { 
    $(this).closest("tr").next().show().find('.longboxsmall').hide();
});

결과적으로 숨겨진 입력은 다음과 같습니다.

<input class="longboxsmall" type="text" />

비활성화된 특성을 입력에 추가하려면 어떻게 해야 합니까?

$("input").attr("disabled", true);...의 시점에서.더 이상은 모르겠어요.

지금이 2013년 12월인데 무슨 말을 해야 할지 모르겠어요.

처음에는 항상 그랬었습니다..attr()그때는 항상..prop()그래서 저는 여기로 돌아와서 답을 업데이트하고 더 정확하게 만들었습니다.

그리고 1년 후에 jQuery는 그들의 마음을 다시 바꿨고 저는 이것을 기록하고 싶지도 않습니다.

간단히 말해서, 현재로서는 이것이 가장 좋은 대답입니다: "둘 다 사용할 수 있습니다...하지만 상황에 따라 다릅니다."

대신 다음 답변을 읽어보셔야 합니다. https://stackoverflow.com/a/5876747/257493

이러한 변경 사항에 대한 릴리스 정보는 다음과 같습니다.

값을 가져오거나 설정하는 데는 .attr() 또는 .prop()를 사용하면 안 됩니다.대신 .val() 메서드를 사용합니다(1.6 이전과 마찬가지로 .attr("value", "somevalue")를 사용하면 계속 작동합니다).

선호 용도 요약

.prop() 메서드는 부울 특성/속성 및 HTML에 없는 속성(예: window.location)에 사용해야 합니다.다른 모든 속성(html에서 볼 수 있는 속성)은 .attr() 메서드를 사용하여 계속 조작할 수 있습니다.

다른 말로 하면,

.prop = 삭제되지 않은 항목"

.attr" = 문서 항목

... ...

여기서 API 안정성에 대한 교훈을 얻을 수 있을까요?

소스의 작업 코드:

HTML 월드

<select name="select_from" disabled>...</select>

제이에스 월드

var from = jQuery('select[name=select_from]');

//add disabled
from.attr('disabled', 'disabled');



//remove it
from.removeAttr("disabled");

jQuery를 사용하는 경우 비활성화된 속성을 설정하는 몇 가지 방법이 있습니다.

var $element = $(...);
    $element.prop('disabled', true);
    $element.attr('disabled', true); 

    // The following do not require jQuery
    $element.get(0).disabled = true;
    $element.get(0).setAttribute('disabled', true);
    $element[0].disabled = true;
    $element[0].setAttribute('disabled', true);
$(element).prop('disabled', true); //true|disabled will work on all
$(element).attr('disabled', true); 
element.disabled = true;
element.setAttribute('disabled', true);

위의 모든 것은 완벽하게 유효한 솔루션입니다.당신의 요구에 가장 적합한 것을 고르세요.

JS로 이를 수행하는 방법을 묻는 질문이었기 때문에 바닐라 JS 구현을 제공하고 있습니다.

var element = document.querySelector(".your-element-class-goes-here");
// it's a good idea to check whether the element exists
if (element != null && element != undefined) {
  element.disabled = "disabled";
}

DOM 요소를 가져와 비활성화된 속성을 직접 설정할 수 있습니다.

$(".shownextrow").click(function() { 
  $(this).closest("tr").next().show()
          .find('.longboxsmall').hide()[0].disabled = 'disabled';
});

또는 둘 이상인 경우 사용할 수 있습니다.each()모든 설정:

$(".shownextrow").click(function() { 
  $(this).closest("tr").next().show()
          .find('.longboxsmall').each(function() {
               this.style.display = 'none';
               this.disabled = 'disabled';
          });
});

jQuery's를 사용합니다.attr()방법

$(this).closest("tr").next().show().find('.longboxsmall').attr('disabled', 'disabled');

JQuery에서는 다음 기능을 사용할 수 있습니다.

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

기본 J의 경우 다음을 사용할 수 있습니다.

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

언급URL : https://stackoverflow.com/questions/3806685/add-disabled-attribute-to-input-element-using-javascript

반응형