Javascript는 드롭다운 목록 상자 샘플 code_javascript 기술에서 텍스트 값을 가져옵니다.

최근에 사용자가 드롭다운 목록에서 다음 HTML 코드와 같은 옵션을 클릭한 후 선택한 콘텐츠를 저장하는 문제가 발생했습니다.

코드 복사 코드는 다음과 같습니다.

옵션 값="1">베이징
<옵션 값="2" >상하이
<옵션 값="2" >광저우 🎜>


즉, 사용자가 "Shanghai" 열을 선택하면 "Shanghai"라는 이름을 저장해야 합니다. 사실 방법은 매우 간단합니다. 다음 자바스크립트 코드를 보세요:

코드 복사 코드는 다음과 같습니다:

function isSelected (value) {

var cityName;
var city = document.getElementById("city")
//선택한 도시 이름 가져오기
for(i=0;iif(city[i].selected==true){
cityName = city[i].innerText; //요점
alert("cityName:" cityName); }
}


다음을 수행할 수도 있습니다.

코드 복사 코드는 다음과 같습니다. 다음과 같습니다: function isSelected(value) {

var city = document.getElementById("city")

alert(city.options[city.selectedIndex].innerText);
}


대략적인 설명을 하자면 먼저 HTML 페이지에 드롭다운 상자가 있고 드롭다운 상자에 "city" ID가 정의되어 있으며 onchange가 정의되어 있습니다. 이벤트가 바인딩되고 이 이벤트를 통해 자바스크립트 함수가 호출됩니다.

javascript 함수에서는 문서 객체를 통해 현재 드롭다운 상자의 노드 요소를 가져옵니다. 노드의 값은 단 하나가 아니기 때문에 마디. 루프 중에 현재 옵션이 선택되어 있는지 판단하고, 선택되어 있으면 city[i].innerText 메소드를 사용하여 현재 선택된 텍스트 값을 가져옵니다. 물론, 옵션 값을 구해야 한다면 city[i].value

이렇게 하면 됩니다. 이때 위의 방법을 통해 IE에서 원하는 결과를 얻을 수 있습니다. 그러나 FIREFOX에서 테스트를 해보니 이 방법이 통하지 않는 것으로 나타났고, 결국 정보를 참고하여 다른 방법을 찾았습니다. city[i].innerText를 city[i].text로 변경하면 됩니다. 이 방법은 IE와 FIXEFOX 모두에 적용 가능합니다!