2011-03-30 10 views

답변

2

나는하지 않았다 줄 바꿈을 유지하기를 원한다는 것을 알기 때문에 더 나은 버전이 있습니다. 가능성이없는 문자열 %% br %%로 br를 대체 한 다음 끝에 새 줄 (\ n)으로 바꿉니다. 따라서 해당 문자열이 텍스트에 실제로 나타나면 새 줄로 바뀝니다. 원하는 것을 마음대로 바꿀 수 있습니다. 텍스트에서 발생할 가능성이 거의없는 내용으로 만드십시오.

<script> 

function removeMarkup(m) { 
    var d = document.createElement('div'); 
    d.innerHTML = m; 
    var c = 0; 

    // Make brString something that should never appear in the text 
    // and has no special meaning in a RegExp 
    var brString = '%%br%%' 
    var re = new RegExp('\\s*' + brString + '\\s*','g'); 

    function getTextWithReturns(node) { 

    var tag = node.tagName && node.tagName.toLowerCase(); 
    var nodes = node.childNodes; 
    var type = node.nodeType; 
    var s = ''; 

    // Deal with br 
    if (tag == 'br') { 
     return brString; 
    } 

    if (nodes && nodes.length) { 
     for (var i=0, iLen=nodes.length; i<iLen; i++) { 
     s += getTextWithReturns(nodes[i]); 
     } 
    } else if (type == 3 || type == 4) { 
     s += node.nodeValue 
    } 
    return s; 
    } 
    return reduceWhitespace(getTextWithReturns(d)).replace(re,'\n'); 
} 

function reduceWhitespace(s) { 
    return s.replace(/^\s*/,'').replace(/\s*$/,'').replace(/\s+/g,' '); 
} 

</script> 

<div id="d0">some text <i>more</i> text 
    <p>Here is a paragraph with some <b>bold</b> and <i>italic</i> text, plus a <span>span</span> and a line break break break<br> about there.</p> 
    <p>Here is another paragraph with some <b>bold</b> and <i>italic</i> text, plus plus a <span>span</span> and a line break <br> here.</p> 
</div> 

<form> 
<textarea id="ta0" rows="10" cols="50"></textarea> 
<button type="button" onclick=" 
    var ta = document.getElementById('ta0'); 
    var div = document.getElementById('d0'); 
    ta.value = removeMarkup(div.innerHTML); 
">Set value</button><input type="reset"> 
</form> 
0
$("#my_textarea").change(function(){ 
    var cleanText = $("<span />").html(this.value); 
    this.value = cleanText.text(); 
}); 

예 (.. 굵게, 기울임 꼴, 이미지 등) 난 다음
을 대체 나머지 부분을 제거 할 필요가 첫째로 생각 : 나의 첫 번째 응답에서 http://jsfiddle.net/6WbXN/

+0

innerText는 일부 브라우저에서 지원되지 않는 독점적 인 Microsoft 속성입니다. (대략) W3C DOM 속성은 textContent입니다. 그러나 공백과 줄 바꿈은 다르게 처리되므로 일종의 정규식이나 바꾸기를 사용하여 정규화해야합니다. – RobG

+0

줄 바꿈을 다르게 처리하는 것은 어느 것입니까? 'textContent' 또는'innerText'? 제 편집이 브라우저 간 문제를 해결합니까? – mattsven

+0

그들은 서로 다릅니다. 덧붙여 말하자면, jQuery는 둘 다 사용하지 않고, 텍스트 노드를 찾고 해당 값을 연결하는 자식 노드를 재귀 적으로 사용합니다. 이는 합리적인 전략이지만 일반적으로 textContent 또는 innerText를 사용할 수있는 경우보다 느립니다. – RobG