알이즈웰

html 줄바꿈 적용 오류 본문

Programming/Front-End

html 줄바꿈 적용 오류

2017. 10. 19. 18:33

같은 데이터를 뿌리는ㄷㅔ 어떤 화면에서는 줄바꿈(enter 처리)이 적용되고, 다른 곳에서는 안되는 경우가 있었다.


데이터를 가져와서 뿌리는 방법이 다른지는 모르겠다.


잘 나오는 쪽 소스는 내가 볼 수가 없으니.


안 나오는 쪽은 데이터를 가져와서 html로 그려 넣었다.


html로 그려넣으면 데이터 내 \n을 </br>로 못 바꾸나?



<table class="ui table vertical devTableStyle">

    <caption></caption>

    <colgroup>

        <col width="150px">

        <col width="370px">

    </colgroup>

    <tbody>

    <tr>

        <th>신고일</th>

        <td id="requestDate"></td>

    </tr>

    <tr>

        <th>사유</th>

        <td id="requestReasonType"></td>

    </tr>

    <tr>

        <th>상세사유</th>

        <td id="requestReasonDetail"></td>

    </tr>

    <tr id="tr_replyDate" style="display:none;">

        <th>답변일</th>

        <td id="replyDate"></td>

    </tr>

    <tr id="tr_replyDetail" style="display:none;">

        <th>구매자에게<br />전하실 말씀</th>

        <td id="replyDetail"></td>

    </tr>

    </tbody>

</table>



$(document).ready(function () { // 1. html로 뿌림 -> 그래두 안됨 $("#replyDetail").html(GridGetValue(nonReceiptInfoGrid, "응대상세",0)); // 2. text로 뿌림 -> 그래두 안됨 $("#replyDetail").text(GridGetValue(nonReceiptInfoGrid, "응대상세",0)); // 3. console에 찍어봄 -> 줄바꿈 잘 됨 console.log(GridGetValue(nonReceiptInfoGrid, "응대상세",0)); // 4. 결국 replace로 \n -> </br> 로 교체함 $("#replyDetail").html(GridGetValue(nonReceiptInfoGrid, "응대상세",0).replace(/\n/gi, "
")); });





replace를 replaceAll처럼 사용해서 모든 \n들을 </br>로 바꿔쥬깅

억지로 이렇게 바꾸는건 좋지 않은 방향인것 같지만 일단 급한대로 수정부터 해야징


원인파악을 하고싶은데, 최소한 잘 보이는 화면과 소스 비교ㄹㅏ둥..

아마 그쪽 개발 환경(css라던가.. layout에 미리 해놓은 설정이라든가..)과 이쪽 개발환경이 달라서인듯 하당








-> 억지로 치환해쥼 흥

var str = "Hello World"; // 1. 그냥 replace str.replace("o", "*"); // o를 *로 치환. 단 첫번째 o만 치환하고 나머지는 변경되지 않는다. // 출력 : Hell* World // 2. replace를 replaceAll처럼 사용하기 str.replace(/o/gi, "*"); // 모든 o를(대/소문자 구문없이) *로 치환 // 출력 : Hell* W*rld


설명 1.

g : 발생할 모든 pattern에 대한 전역 검색

i : 대/소문자 구분 안함

m : 여러 줄 검색. (그렇다구 한다)


설명 2.

정규식에서 사용하는 특수문자 ( . ^ ( ) )를 치환할 때는 escape( \ ) 뮨자를 붙여주어야 한다.

ex. str = "Hello World.";

str.replace(/\./, "!");

출력 : Hello World!




[참고]


자바스크립트에서 REPLACE를 REPLACEALL 처럼 사용하기


[javascript|자바스크립트] 특정 문자 모두 바꾸기 (replaceAll) 쉽게 사용하기










Comments