[IE] Internet Explorer에서 value=""일 경우 value="1"로 변경되는 경우 해결방법

IE 11에서 value가 없을 경우 자동으로 1부터 시작된다.

또는 01, 02 같은 문자는 숫자로 변경되어 1, 2로 되어 작동한다.

 

<li value="">전체</li>
<li value="1">A</li>
<li value="2">B</li>
<li value="3">C</li>
<li value="4">D</li>

<!-- IE 적용 -->
<li value="1">전체</li>
<li value="1">A</li>
<li value="2">B</li>
<li value="3">C</li>
<li value="4">D</li>

<li value="01">A</li>
<li value="02">B</li>
<li value="03">C</li>
<li value="04">D</li>

<!-- IE 적용 -->
<li value="1">A</li>
<li value="2">B</li>
<li value="3">C</li>
<li value="4">D</li>

---

해결방법 - 1

이럴경우 해결하기 위해서는 커스텀 테이터 속성를 사용한다.

<li data-value="">전체</li>
<li data-value="1">A</li>
<li data-value="2">B</li>
<li data-value="3">C</li>
<li data-value="4">D</li>

<input id="selected_list" type="hidden">

<li data-value="01">A</li>
<li data-value="02">B</li>
<li data-value="03">C</li>
<li data-value="04">D</li>

<input id="selected_list" type="hidden">

 

value값 가져오기

// javaScript
document.getElementById('selected_list').getAttribute('data-value');

//jQuery

//data('dataName'): 해당 커스텀데이터속성의 값을 반환(dataName은 속성 'data-'를 제외한 이름)
$('#selected_list').data('value');

// attr('attrName'): 해당 속성 값 반환
$('#selected_list').attr('data-value'); 

---

해결방법 - 2

공백으로 하고 싶을 경우 해결방법은 하나 더 있다

"" 대신 " "를 사용하는 것이다.

<li data-value=" ">전체</li>
<li data-value="1">A</li>
<li data-value="2">B</li>
<li data-value="3">C</li>
<li data-value="4">D</li>

<input id="selected_list" type="hidden">

그리고 결과를 보낼때는 trim으로 감싸서 보낸다.

 

 

도움이 되셨다면 아래 ♡ 눌러주세요 (로그인 필요 없습니당)