HTML 드롭 다운 목록

Question

개인이 option value을 선택한 후 option disabled 태그로 새로 고침하고 선택 항목을 확인한 후 다시 option value을 선택하기로 결정한 html 드롭 다운 목록을 만드는 방법은 무엇입니까?

<form> 
<select name="URL" onchange="window.location.href=this.form.URL.options[this.form.URL.selectedIndex].value"> 
<option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option> 
<option value="LINK">Ingham County (Google Map/PDF)</option> 
<option value="LINK">Clinton County (PDF)</option> 
<option value="LINK">Eaton County (PDF)</option> 
</select> 
</form> 

-를 선택 이름 - 태그가 동일한 윈도우에서 여는 URL을 사용자에게 렌더링 : HTML

.

<select name="URL" onchange="window.location.href=this.form.URL.options[this.form.URL.selectedIndex].value"> 

개인이 목록에서 항목을 선택할 경우 현재 로선

는, 자신의 (같은 창에서 열립니다)를 선택하고 (원래 웹 페이지) 반환을 볼 드롭 다운 메뉴가로 복귀하지 않습니다

를

<option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option> 

option value 태그 선택에 남아 있지만 브라우저 창을 새로 고침/다시로드하지 않는 한 태그 선택에 남아 있습니다.

Answer 1

기본적으로 javascript 없이는 작업을 수행 할 수 없습니다.

내가 얼마나 알고 있는지 알지 못하므로 자바 스크립트에 대한 사전 지식이 없다고 가정합니다.

다음 내용은 사용자가 요구하는 것을 수행해야합니다.

"이"키워드를 사용하여 DropDown 목록을 매개 변수로 전달하는 "ResetToDisabled"라는 javascript 함수를 호출하도록 onchange 속성을 변경했습니다. 여기에 무슨 일이 일어나고 무엇

<select name="URL" onchange="ResetToDisabled(this);"> 
    <option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option> 
    <option value="LINK">Ingham County (Google Map/PDF)</option> 
    <option value="LINK">Clinton County (PDF)</option> 
    <option value="LINK">Eaton County (PDF)</option> 
</select> 
<script type="text/javascript"> 
    function ResetToDisabled(DropDown) { 
     var TargetIndex = DropDown.selectedIndex; 
     DropDown.selectedIndex = 0; 
     window.location.href = DropDown.options[TargetIndex].value; 
    } 
</script> 

, 나는 매개 변수로 (우리가 드롭 다운 목록 될 것입니다 가정 할 수있다이 경우) 객체에 소요 "ResetToDisabled"라는 자바 스크립트 함수를 만드는거야 것입니다.

이 함수는 "TargetIndex"라는 임시 변수를 만들고이 값을 드롭 다운의 선택된 인덱스로 설정합니다.

그런 다음 드롭 다운 목록의 선택한 인덱스를 0 (첫 번째 옵션)으로 설정합니다.

그런 다음 코드 줄을 실행하여 새 웹 페이지를 엽니 다. 그러나 드롭 다운을 첫 번째 옵션으로 다시 설정 했으므로 뒤로를 클릭하면 선택한 옵션으로 해당 옵션이 기억됩니다.

내가 추가해야한다고 생각합니다. 많은 사이트가 메뉴에 사용하는 것과 동일한 동작을 얻으려고하는 것 같습니다. 그렇다면 나중에 "CSS 드롭 다운 메뉴"를 검색하여 선택 드롭의 모양을 변경하는 것이 매우 어렵다는 것을 알기 때문에 검색 할 수 있습니다.

Answer 2

이 경우 jquery를 사용할 필요가 없습니다!

html 파일;

<form> 
<select name="URL" onchange="changeme(this)"> 
<option disabled="disabled" selected="selected">Choose a County for Recycling Information.......</option> 
<option value="LINK">Ingham County (Google Map/PDF)</option> 
<option value="LINK">Clinton County (PDF)</option> 
<option value="LINK">Eaton County (PDF)</option> 
</select> 
</form> 

js 파일; 그들이 다시 페이지를 탐색하는 방법에 따라

function changeme(mselect) { 
    for (var i = 0; i < mselect.options.length; i++) { 
     if (mselect.options[i].selected == true) { 
      mselect.options[i].setAttribute('disabled', 'disabled'); 
     } 
     else { 
      mselect.options[i].removeAttribute('disabled'); 
     } 
    } 
} 

Answer 3

, 당신은 페이지로드에 selected index을 설정 자바 스크립트의 조금을 할 수 있어야한다. 아직도 당신이 history.back();로 다시 탐색하는 것처럼 소리가 선택한 값이 동일하고,이 가능성이 보통 onload 이벤트를 수행하지 않습니다에 대한

YourHTMLElement.selectedIndex = 0; 

그러나 나는주의 할 것이다.

그러나 나는 그와 같은 문제에 도움이되는 대답 here을 찾았습니다. jQuery의 문서 준비 이벤트가 발생하여 연결하여 selectedIndex을 0으로 재설정 할 수 있습니다.