드롭 다운 양식 필드

Question

JavaScript를 사용하면 드롭 다운 메뉴에 목록 옵션 대신 입력 텍스트 유형의 양식 필드를 표시 할 수 있습니까? jsfiddle 데모 예제를 얻을 수 있습니까?

Answer 1

이렇게하려면 JQuery를 사용하는 것이 좋습니다. 기본적으로 모든 입력 필드가있는 div를 숨기고 표시하십시오. 이렇게하면 네이티브 드롭 다운이라는 환상을 만들 수 있습니다. 표준 드롭 다운은 맞춤 마크 업을 지원하지 않습니다. "사용자 지정 드롭 다운"에 대한 제 3 자 대안이 있습니다. 위의 제안에 대한 약간의 변형을 사용하여 모두 구현 된 것으로 의심됩니다 ...

Answer 2

당연히 가능하지만 일반적인 <select> 요소를 사용하는 것이 가능합니다. 여러 입력 (예 : <input type = "text">)으로 구성된 <div>을 생성해야합니다.

그러면 버튼이 생기고 (아래쪽 화살표 이미지로 :)^onclick 이벤트에는 <div>을 나타내는 함수가 바인드됩니다. <div>을 숨기려면 숨기기 기능을 배경의 클릭이나 단추의 다른 클릭에 바인딩 할 수 있습니다.

일부 요소를 추가하고 <div>을 표시하는 동안 드롭 다운 효과를 만들려면 높이를 0으로 설정 한 다음 타이머를 사용하여 높이를 계속 높일 수 있습니다.