JavaScript의 다중 선택 요소에서 선택한 값을 얻는 방법은 무엇입니까?

다중 선택 요소에서 선택한 모든 옵션 획득

웹 개발 영역에서 일반적인 요구 사항은 선택한 값을 검색하는 것입니다. JavaScript를 사용하여 다중 선택 상자에서. 이러한 요구를 해결하기 위해 제공된 솔루션을 자세히 살펴보겠습니다.

한 가지 접근 방식에는 select 요소의 옵션을 반복하고 해당 옵션이 선택되었는지 확인한 다음 해당 값을 배열에 누적하는 것입니다. 이 방법은 간단하지만 특히 큰 목록을 처리할 때 번거로울 수 있습니다.

두 번째 답변에서 제안된 것처럼 더 우아한 솔루션은 getSelectValues() 함수를 사용하는 것입니다. 옵션의 값 속성 또는 텍스트 콘텐츠에서 파생되었는지 여부에 관계없이 옵션을 효율적으로 반복하여 선택한 값을 수집합니다.

제공된 예를 고려하세요.

<code class="html"><select multiple>
  <option>opt 1 text</option>
  <option value="opt 2 value">opt 2 text</option>
</select>

<button onclick="
  var el = document.getElementsByTagName('select')[0];
  alert(getSelectValues(el));
">Show selected values</button></code>

버튼이 클릭하면 getSelectValues() 함수가 선택한 옵션 값을 캡처하여 경고 대화 상자에 표시합니다. 이는 이 방법의 용이성과 유연성을 보여줍니다.

수동 반복을 선택하든 getSelectValues() 함수를 활용하든 다중 선택 상자에서 선택한 값을 검색하여 액세스할 수 있는 강력한 솔루션이 있습니다. 웹 애플리케이션에서 효과적으로 데이터를 조작할 수 있습니다.

위 내용은 JavaScript의 다중 선택 요소에서 선택한 값을 얻는 방법은 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!