jQuery는 줄 바꿈을 br로 변환 (nl2br 상당)

jQuery는 줄 바꿈을 br로 변환 (nl2br 상당)

---

jQuery가 일부 텍스트 영역 콘텐츠를 가져 오기 위해 도입하고 있습니다.

줄 바꿈을 유지하고 싶습니다.

이 작업을 수행하는 정말 간단한 방법이 필요합니다 ...

---

도장 : http://so.devilmaycode.it/jquery-convert-line-breaks-to-br-nl2br-equivalent

function nl2br (str, is_xhtml) {   
    var breakTag = (is_xhtml || typeof is_xhtml === 'undefined') ? '<br />' : '<br>';    
    return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, '$1'+ breakTag +'$2');
}

• http://phpjs.org/functions/nl2br:480

---

간단히 할 수 있습니다.

textAreaContent=textAreaContent.replace(/\n/g,"<br>");

---

관리자 코드에 증명하십시오 (가급적 일반 js 함수 라이브러리에 있음).

String.prototype.nl2br = function()
{
    return this.replace(/\n/g, "<br />");
}

용법 :

var myString = "test\ntest2";

myString.nl2br();

다양한 종류의 함수를 생성 할 수 있습니다.

---

내용 을 변경하는 대신 렌더링 을 변경하는 정신으로 다음 CSS 는 각 줄 바꿈을 다음과 같이 작동합니다 .<br>

white-space: pre;
white-space: pre-line;

왜 두 가지 규칙 : pre-line개행에만 영향을 미칩니다 (단서 @KevinPauli에 감사드립니다). IE6-7 기타 오래된 브라우저 및 pre는 nowrap여러 공간을 포함 하고 렌더링 하는 더 극단적으로 되돌아갑니다 . mozilla 및 css-tricks의 설치 및 기타 설정 ( pre-wrap) 에 대한 자세한 내용은 @Sablefoste에게 감사합니다.

일반적으로 나는 질문에 대답 하기보다는 두-th 추측에, 대한 편견을 싫어하지만 , 경우 줄 바꿈이을 <br>마크-up으로 바꾸면 씻지 않은 user-입력 입력 으로 주입 공격에, 대한 취약성이 증가 할 수 있습니다 . 문자적인 질문이 의미하는 변경 .text()전화를 발견 할 때마다 밝은 빨간색 선을 넘고 .html()있습니다. (이 점을 강조해 주신 @AlexS에게 감사드립니다.) 보안 위험을 배제 미래의 변경으로 인해 무의 적으로 위험이 모든 것을 보호합니다. 대신, CSS를 사용하면 더 안전하게 마크 업없이 하드 줄 바꿈을 얻을 수 있습니다 .text().

---

해결책

이 코드 사용

jQuery.nl2br = function(varTest){
  return varTest.replace(/(\r\n|\n\r|\r|\n)/g, "<br>");
};

---

이 JavaScript 함수는 스왑을 처리하기 위해 앞으로 또는 사용할 것인지 여부를 고려합니다.

(HTML 줄 바꿈 삽입 또는 늘)

/**
 * This function is same as PHP's nl2br() with default parameters.
 *
 * @param {string} str Input text
 * @param {boolean} replaceMode Use replace instead of insert
 * @param {boolean} isXhtml Use XHTML 
 * @return {string} Filtered text
 */
function nl2br (str, replaceMode, isXhtml) {

  var breakTag = (isXhtml) ? '<br />' : '<br>';
  var replaceStr = (replaceMode) ? '$1'+ breakTag : '$1'+ breakTag +'$2';
  return (str + '').replace(/([^>\r\n]?)(\r\n|\n\r|\r|\n)/g, replaceStr);
}

데모-JSFiddle

JavaScript nl2br 및 br2nl 함수

---

이를 위해 약간의 jQuery 확장을 작성했습니다.

$.fn.nl2brText = function (sText) {
    var bReturnValue = 'undefined' == typeof sText;
    if(bReturnValue) {
        sText = $('<pre>').html(this.html().replace(/<br[^>]*>/i, '\n')).text();
    }
    var aElms = [];
    sText.split(/\r\n|\r|\n/).forEach(function(sSubstring) {
        if(aElms.length) {
            aElms.push(document.createElement('br'));
        }
        aElms.push(document.createTextNode(sSubstring));
    });
    var $aElms = $(aElms);
    if(bReturnValue) {
        return $aElms;
    }
    return this.empty().append($aElms);
};

---

@Luca Filosofi의 대답을 개선하기 위해

필요한 경우이 정규식의 시작 절을로 변경하면 /([^>[\s]?\r\n]?)개행 바로 뒤에 태그가 오는 대신 태그와 공백 뒤에 개행이 오는 경우도 포함됩니다.

---

줄 바꿈을 유지하면서 DOM의 텍스트 영역에서 텍스트를 삽입하는 또 다른 방법 은 노드 및 해당 하위 항목 의 렌더링 된 텍스트 콘텐츠 를 나타내는 Node.innerText 속성 을 사용하는 것 입니다.

게터로서, 사용자가 커서로 요소의 내용을 강조 표시 한 다음 클립 보드에 복사하면 얻을 수있는 텍스트와 비슷합니다.

이 속성은 2016 년에 표준이되었으며 최신 브라우저에서 잘 지원됩니다. 사용할 수 있습니까 :이 답변을 게시했을 때 97 % 글로벌 범위.

참고 URL : https://stackoverflow.com/questions/2919337/jquery-convert-line-breaks-to-br-nl2br-equivalent