HTML 텍스트 영역에 줄 바꿈을 추가하는 방법은 무엇입니까?
<textarea>
JavaScript로 편집하고 있습니다. 문제는 줄 바꿈을 할 때 표시되지 않는다는 것입니다. 어떻게해야합니까?
함수를 작성하는 데 가치가 있지만 줄 바꿈은하지 않습니다.
줄 바꿈 ( \n\r
?)이 HTML <br/>
태그 와 동일하지 않다는 사실에서 문제가 발생 합니다.
var text = document.forms[0].txt.value;
text = text.replace(/\r?\n/g, '<br />');
일반 자바 스크립트를 사용하고 텍스트 영역 값에 문자열을 할당 해야하는 경우
document.getElementById("textareaid").value='texthere\\\ntexttext'.
당신은 교체해야 \n
나 < br >
에\\\n
그렇지 않으면 Uncaught SyntaxError: Unexpected token ILLEGAL
모든 브라우저에서 제공 됩니다.
당신 \n
은 linebreaks
내부 에 사용해야 합니다textarea
어쩌면 누군가가 이것을 유용하게 사용할 수 있습니다
서버 변수에서 javascript 변수로 전달 된 줄 바꿈에 문제가 있었고 javascript는 텍스트 영역에 knockout.js 값 바인딩을 사용하여 작성했습니다.
해결책은 새로운 줄을 두 번 탈출했습니다.
orginal.Replace("\r\n", "\\r\\n")
단일 이스케이프 문자로 자바 스크립트가 구문 분석되지 않았기 때문에 서버 측에서.
새 줄은 브라우저의 공백 일 뿐이며 일반적인 공백 ( "")과 다른 것으로 취급되지 않습니다. 새 줄을 얻으려면 <BR />
요소 를 삽입해야합니다 .
문제를 해결하기위한 또 다른 시도 : 텍스트를 텍스트 영역에 입력 한 다음 단추 뒤에 JavaScript를 추가하여 보이지 않는 문자를 읽을 수있는 문자로 변환하고 결과를로 덤프하십시오 DIV
. 브라우저가 원하는 것을 알려줍니다.
자신의 페이지 안에 텍스트를 표시하려면 <pre>
태그를 사용할 수 있습니다 .
document.querySelector('textarea').addEventListener('keyup', function() {
document.querySelector('pre').innerText = this.value;
});
<textarea placeholder="type text here"></textarea>
<pre>
The
new line will
be respected
</pre>
ID가 #infoartist 인 textarea가 있습니다 .
<textarea id="infoartist" ng-show="dForm" style="width: 100%;" placeholder="Tell your contacts and collectors about yourself."></textarea>
자바 스크립트 코드에서 텍스트 영역의 값을 가져 와서 새 줄 (\ n \ r) <br />
을 다음과 같이 태그로 대체합니다 .
var text = document.getElementById("infoartist").value;
text = text.replace(/\r?\n/g, '<br />');
따라서 jquery를 사용하는 경우 (나 같은) :
var text = $("#infoartist").val();
text = text.replace(/\r?\n/g, '<br />');
그것이 당신을 도왔기를 바랍니다. :-)
줄 바꿈으로 testarea 값을 서버에 보내야하는 경우 nl2br 을 사용하십시오.
여기 내가했던 같은 문제에 대해 한 일이 있습니다.
jsp의 다음 페이지로 텍스트를 전달할 때 다음과 같은 것을 읽는 대신 텍스트 영역으로 읽습니다.
그래서 원하는대로 출력이 나왔습니다. 다른 속성의 경우 다음과 같이 사용할 수 있습니다.
<textarea style="background-color: white; border: none; width:660px;font-family: Arial, Helvetica, sans-serif; font-size:1.0em; resize:none;" name="text" cols="75" rows="15" readonly="readonly" ><s:property value="%{text}"/></textarea>
참고 URL : https://stackoverflow.com/questions/863779/how-to-add-line-breaks-to-an-html-textarea
'IT' 카테고리의 다른 글
멤버를 수동으로 폐기하는 방법 (0) | 2020.06.11 |
---|---|
PyCrypto AES 256을 사용한 암호화 및 복호화 (0) | 2020.06.11 |
JSP 포함 지시문, JSP 포함 조치 및 JSP 태그 파일 사용으로 파일을 포함시키는 것의 차이점은 무엇입니까? (0) | 2020.06.11 |
스트림을 사용하여 BigDecimals 추가 (0) | 2020.06.11 |
jQuery를 사용하여 메타 태그를 읽을 수 있습니까? (0) | 2020.06.11 |