program story

드롭 다운 목록에 빈 항목이없는 빈 HTML SELECT

inputbox 2020. 8. 3. 08:23
반응형

드롭 다운 목록에 빈 항목이없는 빈 HTML SELECT


Subj를 어떻게 구현합니까?

내가 쓸 때 :

<form>
  <select>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>
</form>

선택한 기본 항목은 "aaaa"입니다

내가 쓸 때 :

<form>
  <select>
     <option value=""></option>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>
</form>

선택한 기본 항목은 비어 있지만이 빈 항목은 드롭 다운으로 표시됩니다.

드롭 다운 목록에 숨겨진 기본 빈 값으로 SELECT 태그를 구현하는 방법은 무엇입니까?


비활성화 및 / 또는 숨겨진 속성 만 사용하십시오.

<option selected disabled hidden style='display: none' value=''></option>
  • selected 이 옵션을 기본 옵션으로 만듭니다.
  • disabled 이 옵션을 클릭 할 수 없습니다.
  • style='display: none'이 옵션은 이전 브라우저에서 표시되지 않습니다. 숨겨진 속성에 대한 설명서를 사용할 수 있습니까?를 참조하십시오 .
  • hidden 드롭 다운 목록에이 옵션이 표시되지 않도록합니다.

당신은 설정하여 수 selectedIndex-1사용 .prop: http://jsfiddle.net/R9auG/ .

이전의 jQuery 버전을 사용하십시오 .attr대신 .prop: http://jsfiddle.net/R9auG/71/ .


간단히 사용

<option value="" selected disabled>Please select an option...</option>

스크립트없이 어디에서나 작동하며 동시에 사용자에게 지시 할 수 있습니다.


<select>
     <option value="" style="display:none;"></option>
     <option value="0">aaaa</option>
     <option value="1">bbbb</option>
  </select>

다음은 일반 JavaScript를 사용하여 수행하는 간단한 방법입니다. 이것은 pimvdb가 게시 한 jQuery 스크립트와 동일한 바닐라입니다. 여기서 테스트 할 수 있습니다 .

<script type='text/javascript'>
  window.onload = function(){
    document.getElementById('id_here').selectedIndex = -1;
  }
</script>

.

<select id="id_here">
  <option>aaaa</option>
  <option>bbbb</option>
</select>

"id_here"가 양식과 JavaScript에서 일치하는지 확인하십시오.


당신은 할 수 없습니다. 그들은 단순히 그런 식으로 작동하지 않습니다. 드롭 다운 메뉴에는 항상 옵션 중 하나가 선택되어 있어야합니다.

당신은 (권장하지는 않지만) 변경 이벤트를 관찰 한 다음 JS를 사용하여 첫 번째 옵션이 비어 있으면 삭제할 수 있습니다.


순수하게 HTML의 경우 @isherwood는 훌륭한 솔루션을 제공합니다. jQuery의 경우 선택 드롭 다운에 ID를 제공하고 jQuery로 선택하십시오.

<form>
  <select id="myDropDown">
    <option value="0">aaaa</option>
    <option value="1">bbbb</option>
  </select>
</form> 

그런 다음이 jQuery를 사용하여 페이지로드시 드롭 다운을 지우십시오.

$(document).ready(function() {
    $('#myDropDown').val(''); 
});

또는 자체적으로 함수 안에 넣습니다.

$('#myDropDown').val(''); 

당신이 찾고있는 것을 달성하고 페이지를 다시로드하지 않고 드롭 다운을 비워야하는 경우 페이지에서 호출 될 수있는 기능에 쉽게 넣을 수 있습니다.


이 스 니펫을 사용해 볼 수 있습니다

$("#your-id")[0].selectedIndex = -1

그것은 나를 위해 일했다.

참고 URL : https://stackoverflow.com/questions/6223865/blank-html-select-without-blank-item-in-dropdown-list

반응형