HTML 선택 옵션에서 공백 유지하기

입력을받는 html 텍스트 상자가 있는데 사용자가 '추가'버튼을 클릭하면 자바 스크립트를 사용하여 텍스트 입력을 받고 HTML 선택에 넣은 문자열의 형식을 지정합니다 상자. 이 상자 중 첫 번째 상자는 2 자리 숫자를 포함해야하지만 공백을 허용 할 수도 있습니다. 형식화 된 문자열은 다음과 같을 것이다 :HTML 선택 옵션에서 공백 유지하기

 
01-ABC-O 
02-DEF-I

을 나는 다른 요소

 
-GHI-O

를 가진 라인 업 항목이 유형의 자바 스크립트 벌금을 표시됩니다 빈 번호를 표시 할 수있는 방법이 필요하지만 옵션을 추가하지만 페이지가 다시로드되고 select가 값으로 채워지는 경우 (Java, jsp 및 struts 1.1을 사용하는 경우) 값이 동일하게 유지되지만 공백은 더 이상 표시되지 않습니다. select 컨트롤에서 (나는 페이지 소스를 보았고, javascript가 옵션을 추가 할 때와 동일하게 보인다).  의 공백 대신 사용하려고했으나 공백 대신 "& nbsp"문자열 만 출력합니다. 나는 또한 "pre"html 블록과 CSS white-space 속성을 사용해 보았지만 어느 것도 효과가 없었다.

더 이상의 설명이 필요하면 알려주세요.

출처

2011-10-18 Erik

이 문제를 보여주는 작은 코드 샘플을 제공 할 수 있습니까? – Rontologist

참조 할이 선택 상자. 옵션 속성 또는 열기 및 닫기 옵션 요소 사이의 값을 사용하고 있습니까? 요소 사이의 공간에 의존한다면 공간은 보존되지 않습니다. – Rontologist

공백을  으로 바꿔야하며 작동해야합니다. 닫는 세미콜론 (질문에 나와있는 예제에서 누락 됨)에 유의하십시오! Javascript를 사용하면 대부분의 (모든?) 브라우저가 자동으로 공백을 렌더링하지만 페이지가로드 될 때 공백이 있으면 (일부 경우는 제외) 모두 무시됩니다.

모든 줄이 올바르게 표시되도록 단락 간격 글꼴을 지정하는 선택 항목에 font-family: CSS 특성을 적용해야합니다.

출처

2011-10-18 21:21:13 DaveRandom

모노 간격 글꼴을 사용하고 있는데, ' '과의 혼동에 대해 유감스럽게 생각합니다. 주석 상자가 HTML로 렌더링되지 않도록 코드로 표시하는 방법을 몰라서 실제로 사용하고 있습니다. ' ' – Erik

알겠습니다. 걱정하지 마세요 - 어떤 브라우저에서 테스트 해 보셨나요? Chrome과 IE8에서이 기능이 작동하기 때문에 - 빠른 정신병 체크 만 했으므로 확실합니다 ... – DaveRandom

HTML 소스를 두 번 확인하고 실수로 이중 탈출하지 않았는지 확인하십시오. 나는. '& nbsp;가 아닌' '을 출력했는지 확인하십시오. – DaveRandom

값을 출력 할 영역에서 사전 CSS 스타일을 사용할 수 있습니다.

<style type="text/css"> 
    #element { 
     white-space: pre; 
    } 
</style> 

<div id="element"> 
    stuff goes here 
</div>

이

는 div 요소의 모든 공백을 보존하는 것입니다 (다른 요소 유형은 작동합니다) 다음은 비 파괴 공간을 사용하는 방법에 대해 걱정할 필요가 없습니다.

출처

2011-10-18 21:36:38 Rontologist

처음 게시물에서 CSS 공백 속성을 사용해 보았을 때, 이것은 제가 의도 한 것입니다. 인라인 및 클래스로 시도했습니다. – Erik

선택 옵션에서 작동하지 않음 – Mayuresh

당신은 유니 코드 문자 'SPACE'(U + 0020) 대신   ("\의 u0020")

출처

2011-12-07 12:46:51

이 스크립트를 통해 추가 건가요을 사용할 수 있습니다, 당신은 "공간에 대한 이스케이프 코드를 사용하는 %를 필요 언 이스케이프가 사용되지 않기 때문에 당신이 다음 언 이스케이프()로 디코딩 A0는 "

logTypeList[i] = new Option(unescape(" kent Agent".replace(/ /g, "%A0")), "theValue");

출처

2012-01-31 12:01:11 Joakim

logTypeList[i] = new Option(unescape(" kent Agent".replace(/ /g, "%A0")), "theValue");

, 당신은 decodeURI을 사용할 수 있습니다 :

logTypeList[i] = new Option(decodeURI(" kent Agent".replace(/ /g, "%C2%A0")), "theValue");

자세한 내용은 http://www.javascripter.net/faq/mathsymbols.htm

출처

2017-03-24 23:11:13 jathri

HTML 선택 옵션에서 공백 유지하기

답변

관련 문제