jQuery를 사용하여 드롭다운에서 선택한 옵션을 안정적으로 검색하는 방법은 무엇입니까?

jQuery를 사용하여 드롭다운에서 선택한 옵션 검색

드롭다운 메뉴 작업 시 선택한 옵션을 정확하게 검색하는 것이 중요합니다. $("#id").val()은 일반적으로 이 목적으로 사용되지만 특정 시나리오에서는 예기치 않은 결과를 반환할 수 있습니다.

문제:

In 어떤 경우에는 $("#id").val()을 사용하면 선택한 옵션의 값이 반환되지 않을 수 있습니다. 특히 드롭다운에 id 속성이 할당된 경우 더욱 그렇습니다. 다음 HTML 코드 예제를 고려해 보겠습니다.

<label for="name">Name</label>
<input type="text" name="name">

이 시나리오에서 $('#aioConceptName').val()을 사용하면 빈 문자열이 반환됩니다.

해결책:

드롭다운에서 선택한 옵션을 정확하게 검색하려면 약간 다른 접근 방식을 사용해야 합니다. 요구 사항에 따라 선택한 텍스트나 값을 얻을 수 있습니다.

선택한 텍스트 검색:

선택한 옵션의 텍스트를 얻으려면 다음을 사용할 수 있습니다. 다음 코드:

var conceptName = $('#aioConceptName').find(":selected").text();

선택 항목 검색 중 값:

선택한 옵션의 값을 얻으려면 약간 다른 코드를 사용합니다.

var conceptName = $('#aioConceptName').find(":selected").val();

이 시나리오에서 val()이 작동하지 않는 이유는 다음과 같습니다. 옵션을 클릭해도 드롭다운 자체의 값은 변경되지 않습니다. 대신, 드롭다운의 하위 요소인 selected 옵션에 :selected 속성을 추가합니다. 따라서 특정 옵션을 선택하고 이에 따라 해당 텍스트나 값을 검색하려면 find(":selected")를 사용해야 합니다.

위 내용은 jQuery를 사용하여 드롭다운에서 선택한 옵션을 안정적으로 검색하는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!