javascript를 사용하여 사용자 정의 드롭 다운 메뉴를 만들어야합니다. 선택 상자를 클릭하면 드롭 다운이 옵션과 함께 나타나고 해당 메뉴의 모양을 사용자 정의해야합니다.드롭 다운을 표시하지 않고 선택 메뉴 클릭시 div 표시
내 접근 방식은 드롭 다운을 표시하는 대신 div가 표시되어야하는 선택 메뉴를 클릭 할 때 div가 옵션과 함께 필요한 스타일을 갖는 것입니다.
onclick() 이벤트를 사용해 보았지만 드롭 다운 메뉴가 나타나기 전에 div가 나타납니다. 이것은 원인을 돕는 것이 아닙니다.
그러한 요구 사항을 달성하는 방법을 제안 해주십시오.
아마도 옵션을 숨길 수 있습니까?
option { display: none; }
당신의 DIV를 완전히 바꾸지 않는 이유는 무엇입니까?
자바 스크립트를 지원하지 않는 브라우저의 정확성 때문일 수 있습니다. 또한 로봇과 스크린 리더와 같은 것들을 더 쉽게 만듭니다. – gereeter
브라우저가 JS를 지원하지 않는다면 (어떤 것들을 알려주십시오!, 알려주세요!) 그러면 onclick은 절대로 작동하지 않습니다. 화면 판독기는 동일한 내용이 HTML에 나타나기 때문에 비 형식 기반 SELECT 대체를 완전히 읽을 수 있습니다. –
링크 (텍스트 기반)와 같은 브라우저가 있지만 훨씬 더 많은 가능성이있는 것은 사용자가 자바 스크립트를 사용하지 않도록 설정 한 것입니다. 또한 실제 선택 태그를 사용할 때의 장점은 검색 엔진 스파이더, 가독성 확장 프로그램 (Safari 판독기) 또는 사람들이 나중에 디자인 할 다른 어떤 것이 든 페이지를 읽는 프로그램이 형식을 지정하는 방법을 알게된다는 것입니다 그것 제대로. 스크린 리더는 어떤 옵션을 선택 할지를 사람에게 물어볼 수 있습니다. select 태그가 없으면 사용자가해야 할 일을 알 수 없습니다. – gereeter
"자바 스크립트를 사용하여 사용자 지정된 드롭 다운 메뉴"는이 질문에 대답하기에 충분한 세부 정보를 제공하지 않습니다. 이 질문에 HTML 출력을 추가하는 것을 고려하십시오. –
다음과 같은 HTML 블록을 cutomize해야합니다. –
https://developer.mozilla.org/en/DOM/event.preventDefault를 시도 했습니까? – Prusse