2013-08-23 5 views
0

javascript를 통해 선택 상자를 만들고 innerhtml로 div 요소를 추가합니다. 옵션의 텍스트 값에 문자열 값 사이에 2 개의 공백이 있습니다. 문자열 비교를 통해 선택한 값을 설정합니다.이 값은 IE8에서만 실패합니다. 그 이유는 중간에 한 개의 공백을 제거하기 때문입니다. 다음은 다른 모든 브라우저에서 내 문제IE8은 문자열 사이에 공백을 유지하지 않습니다.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<head> 
    <script src="http://code.jquery.com/jquery-1.9.1.min.js"></script> 
    <script> 
     function buildSelect() { 
      $('#mydiv').html('<select id="listOption1" name="listOption1"><option value="1234">30.0 x 80.0 in</option><option value="12345">32.0 x 80.0 in</option><option value="123">36 x 80 in</option></select>'); 
     } 
    </script> 
</head> 
<body onload="buildSelect()"> 
    <div id="mydiv"> 
    </div> 
</body> 
</html> 

을 설명하는 데모 HTML 및 스크립트 문자열 사이의 2 개 공간 (32.0 X 80.0)은 IE9.In IE8은 그 유지되지 않습니다를 포함하여 유지 . 누군가 IE8에서 그 공간을 유지하는 방법을 제안 할 수 있습니까?

+0

등의 모든 브라우저에서 일관성을 유지할 수 있습니까? –

+0

한 번 이상 연속 된 공간이 필요하다면 어떤 의미가 있습니까? –

+0

이것은 실제로 API에서받은 몇 가지 데이터입니다. 추가 공간은 가독성을 위해 추가 될 수 있습니다. – Vel

답변

1

당신은 줄 바꿈하지 않는 공백 또는 white-space CSS 속성 삽입 &nbsp;를 사용할 수 있습니다 중 하나 필요한 경우

white-space: pre; 

pre는 포장없이 공백을 보존을 pre-wrap 텍스트를 바꿈됩니다.

IE8에는 유효한 DOCTYPE이 필요하며 항상 존재해야합니다.

+0

select 및 select 요소에 대해 white-space : pre를 추가했습니다. 여전히 IE8에 문제가 있습니다. – Vel

+0

문제가있는 것 같습니다. 이들은 선택/옵션입니다. 당신은' '를 사용해야 할 것입니다. –

0

가독성을 위해 공백을 추가한다고 가정합니다. 이중 공백을 추가 할 모든 공백을 &nbsp;으로 바꿉니다.  을 사용한다면 IE

관련 문제