javascript_javascript 기술로 구현된 드롭다운 상자 기능이 있는 텍스트 상자
- WBOY원래의
- 2016-05-16 16:49:161527검색
콘텐츠를 선택하기 위해 선택적 드롭다운 상자가 필요한 경우도 있지만 입력을 맞춤설정해야 하는 경우도 있습니다. 이 요구 사항에 따라 대부분의 웹 사이트는 드롭다운 상자와 입력 텍스트를 사용하여 선택 항목을 병렬로 또는 별도의 행으로 제공합니다. 그럼 입력하거나 선택할 수 있는 드롭다운 상자처럼 보이도록 하고 싶은데 어떻게 해야 할까요?
실제로 CSS 위치 지정과 약간의 자바스크립트 코드를 통해 이 효과를 시뮬레이션할 수 있습니다.
코드 복사 코드는 다음과 같습니다.
<script><br> var listName = document.getElementById('list-name-for-select');<br> var listSelect = document.getElementById('list-select').onchange = function(e ){<br> console.log(this)<br> if(this.value){<br> listName.value = this.value ' | ' this.options[this.selectedIndex].text;<br> }else{<br> listName.value = ''<br> }<br> };<br> </script>
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.