[ js ] select태그에 readonly 기능주기

input태그에는 readonly 기능이 있지만, SELECT태그에는 readonly 기능이 따로 없다.

SELECT태그에 disable 한 후에 폼데이터를 넘기면 데이터값이 넘어가지 않는다.

select태그에 readonly 기능주기 위해서는 disable 한 후에 폼데이터를 넘기기 직전에 disable을 풀어주는 방법과 아래와 같이 option들을 disable 하는 방법이 있다.

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

// jquery 이용(option에 disable설정 안 할 경우 )
$("#mySelectID option").not(":selected").attr("disabled", "disabled");

// to remove readonly, enable them again:
$("#mySelectID option").not(":selected").attr("disabled", "")

---

[ 참고 사이트 ]

https://beans9.tistory.com/171