programing

jQuery.val 변경 시 입력 값이 변경되지 않습니다.

megabox 2023. 8. 22. 22:04
반응형

jQuery.val 변경 시 입력 값이 변경되지 않습니다.

값에 링크가 있는 HTML 입력이 있습니다.

<input type = 'text' value = 'http://www.link.com' id = 'link' />

특정 이벤트의 값을 변경하기 위해 jQuery를 사용하고 있습니다.

$('#link').val('new value');

위의 코드는 텍스트 상자의 값을 변경하지만 코드의 값은 변경하지 않습니다(값 = 'http://www.link.com '은 변경되지 않음).값 = '도 변경해야 합니다.

사용하다attr대신.
$('#link').attr('value', 'new value');

데모

값 속성을 변경해도 다음은 변경되지 않습니다.defaultValue코드에서(검색 대상).html()또는innerHTML) 값 속성은 다음을 포함합니다.defaultValue값 속성이 아닙니다.

리카도의 대답을 조금 더 설명하자면: https://stackoverflow.com/a/11873775/7672426 .https://stackoverflow.com/a/11873775/7672426

http://api.jquery.com/val/ #val2

약발로

이 방법을 사용하거나 기본값 속성을 사용하여 값을 설정해도 변경 이벤트가 발송되지 않습니다.이러한 이유로 관련 이벤트 처리기가 실행되지 않습니다.실행하려면 값을 설정한 후 .trigger("change")를 호출해야 합니다.

이것은 저에게 일어난 가능한 시나리오입니다.만약 누군가에게 도움이 된다면 훌륭할 것입니다.나는 코드를 따라 어딘가에 모든 텍스트 상자 값을 표시하기 전에 지우기 기능을 사용하는 복잡한 앱을 작성했습니다.얼마 후 jqueryval('value')을 사용하여 텍스트 상자 값을 설정하려고 했지만 그 직후 ClearAllInputs 메서드를 호출한 것을 알아차리지 못했습니다.그래서, 이것도 일어날 수 있습니다.

저에게 문제는 이 필드의 값을 변경하는 것이 효과가 없다는 것이었습니다.

$('#cardNumber').val(maskNumber);

위의 솔루션 중 어떤 것도 저에게 효과가 없었기 때문에 더 자세히 조사한 결과 다음과 같은 것을 발견했습니다.

DOM 레벨 2 이벤트 사양에 따름:변경 이벤트는 컨트롤이 입력 포커스를 잃고 포커스를 얻은 후 값이 수정된 경우에 발생합니다.즉, 변경 이벤트는 사용자 상호 작용에 의해 변경 시 발생하도록 설계됩니다.프로그램 변경으로 인해 이 이벤트가 발생하지 않습니다.

해결책은 트리거 기능을 추가하여 다음과 같은 변경 이벤트를 트리거하는 것이었습니다.

$('#cardNumber').val(maskNumber).trigger('change');
$('#link').prop('value', 'new value');

설명:아트라는 jQuery 1.6에서 작동하지만 jQuery 1.6.1부터 상황이 변경되었습니다.대부분의 경우 prop()는 attr()가 하던 일을 합니다.일반적으로 코드에서 attr() 호출을 prop()로 대체하면 작동합니다.Atr은 html on page load에 정의된 요소의 값을 제공하고 prop는 jQuery를 통해 수정된 요소의 업데이트된 값을 제공합니다.

셀렉터에 특수 문자(예: 마침표)가 있어서 비슷한 문제가 발생했습니다.

해결책은 특수 문자에서 벗어나는 것이었습니다.

$("#dots\\.er\\.bad").val("mmmk");

브라우저는 HTML 태그 요소를 구문 분석하고 해당 DOM 노드 개체를 만듭니다.

  • 입력의 "초기/시작/기본값":
    • 동등:
      • 의 초기 값만value 의 속성.input의 HTML 태그 요소입니다.
      • defaultValue 의 재산.input의 DOM 노드 개체입니다.
    • 다음을 통해 jQuery에 설정됩니다.
      • $(input).attr("value", "42")
  • 입력의 "현재 값":
    • 동등:
      • value 의 속성.input의 HTML 태그 요소
      • value 의 재산.input의 DOM 노드 개체입니다.
    • 다음을 통해 jQuery에 설정됩니다.
      • $(input).val("42")
      • $(input).prop("value", "42")

참고 항목:HTML에서 속성과 속성의 차이점은 무엇입니까?

<script src="//code.jquery.com/jquery.min.js"></script>
<script>
function changes() {
$('#link').val('new value');
}
</script>
<button onclick="changes()">a</button>
<input type='text' value='http://www.link.com' id='link'>

언급URL : https://stackoverflow.com/questions/11873721/jquery-val-change-doesnt-change-input-value

반응형