jQuery는 목록 상단에 빈 옵션을 추가하고 기존 드롭 다운을 선택합니다.

jQuery는 목록 상단에 빈 옵션을 추가하고 기존 드롭 다운을 선택합니다.

---

그래서 드롭 다운 목록이 있습니다

<select id="theSelectId">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

이것이 내가 원하는 것입니다

<select id="theSelectId">
  <option value="" selected="selected"></option>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

이전에 빈 옵션을 추가하고이 옵션으로 설정하려고하면 사용자가 원래 목록에서 값을 선택하도록 강제하고 싶지만 선택해야하는 옵션이 표시 될 때 비어 있기를 원합니다.

이것을 시도하지만 작동하지 않습니다

// Add blank option
var blankOption = {optVal : ''};
$.each(blankOption, function(optVal, text) {
   $('<option></option>').val(optVal).html(text).preprendTo('#theSelectId');
});

그리고 나는 이것을 시도했지만 다른 값을 지 웁니다.

$('#theSelectId option').prependTo('<option value=""></option>');

---

이것은 작동했습니다.

$("#theSelectId").prepend("<option value='' selected='selected'></option>");

Firebug 출력 :

<select id="theSelectId">
  <option selected="selected" value=""/>
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

.prependTo순서를 반대로하려면 다음을 사용할 수도 있습니다 .

​$("<option>", { value: '', selected: true }).prependTo("#theSelectId");​​​​​​​​​​​

---

솔루션 네이티브 자바 스크립트 :

document.getElementById("theSelectId").insertBefore(new Option('', ''), document.getElementById("theSelectId").firstChild);

예 : http://codepen.io/anon/pen/GprybL

참고 URL : https://stackoverflow.com/questions/1070828/jquery-add-blank-option-to-top-of-list-and-make-selected-to-existing-dropdown