>웹 프론트엔드 >JS 튜토리얼 >POST 데이터에 대해 HTML에서 읽기 전용 SELECT 태그를 에뮬레이트하는 방법은 무엇입니까?

POST 데이터에 대해 HTML에서 읽기 전용 SELECT 태그를 에뮬레이트하는 방법은 무엇입니까?

Patricia Arquette
Patricia Arquette원래의
2024-11-16 10:22:02405검색

How to Emulate Readonly SELECT Tag in HTML for POST Data?

POST 데이터에 대해 HTML에서 읽기 전용 SELECT 태그 에뮬레이션

HTML 사양에서는 비활성화된 속성이 있는 SELECT 요소를 비활성화할 수 있지만 이로 인해 POST 또는 GET 요청에 값이 포함되지 않습니다. 이는 원하는 동작이 사용자가 선택 항목을 수정하지 못하게 하면서 제출할 값은 그대로 유지하는 것인 경우 문제가 됩니다.

이 문제를 극복하고 POST 데이터를 보존하면서 읽기 전용 기능을 얻으려면 2단계 접근 방식이 권장됩니다. :

  1. Keep the SELECT 비활성화: 사용자가 SELECT 요소에 비활성화된 속성을 유지하여 사용자가 상호작용.
  2. 숨겨진 입력 추가: SELECT와 동일한 이름 속성을 가진 숨겨진 입력 요소를 생성하고 해당 값을 SELECT의 현재 값으로 설정합니다.

나중에 SELECT 요소를 활성화하려면 다음 단계를 따르세요.

  1. 다시 활성화하세요. SELECT: SELECT에서 비활성화된 속성을 제거하고 해당 이름 속성을 원래 값으로 다시 설정합니다.
  2. 숨겨진 입력과 동기화: SELECT의 onchange 이벤트에서 해당 속성을 복사합니다. 일관성을 보장하기 위해 숨겨진 입력에 값을 추가합니다.

다음은 이를 설명하는 코드 예제입니다. 접근 방법:

<form>
$('#animal-select').change(function() {
  $('#animal').val($(this).val());
});

위 내용은 POST 데이터에 대해 HTML에서 읽기 전용 SELECT 태그를 에뮬레이트하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.