2012-03-15 6 views
0

양식 제출을위한 일반 텍스트 영역이 있습니다. Enter 키를 누를 때 줄 바꿈을 강제로 실행하고 싶습니다. 지금은 ENTER 때를 인식하도록 할 수 있습니다. 키 코드 13이 눌러졌습니다. 그러나 출력 된 HTML에 줄 바꿈을 추가하지는 않습니다. 이 작업은 어떻게 수행되며, 그렇다면 <br /><br />은 어떻게 사용자로부터 숨길 수 있습니까? 당신입력 할 때 jQuery 줄 바꿈이 추가되지 않습니다.

<textarea cols="50" rows="7" id="textarea"></textarea> 

    <p><div id="data"></div></p> 


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> 

    <script type="text/javascript"> 

     $('#textarea').bind('keyup', function(e) { 

      data = $('#textarea').val() 
      $('#data').html(data); 

      if(e.keyCode==13){ 
       $('#data').append('<br/><br />'); // <--- This won't work 
       } 

     }); 

    </script> 
+0

텍스트 영역이 이미 기본적으로이 작업을 수행, 당신은 단지 당신이 HTML로 표시 할 때'
'태그와 함께 새로운 라인 문자를 교체해야합니다. –

+0

당신은'\ n'을 시도 했습니까? 그리고 텍스트 영역에 줄 바꾸기를 설정 하시겠습니까? – mplungjan

+1

그것은 작동하지만, 다음 키를 눌러 그 노크 아웃. 당신은'\ n'을 그것으로 대체하려고합니다. –

답변

6

이 시도 감사 :

$('#textarea').bind('keyup', function(e) { 
    var data = $('#textarea').val(); 
    $('#data').html(data.replace(/\n/g,"<br />")); 
}); 

DEMO : 당신이 <p> 태그 내부에 데이터를 인쇄하는 경우 http://jsfiddle.net/efLxP/

+0

굉장! 그게 효과가있어. – Graham

0

첫째, <span> 대신 <div>를 사용합니다. 문제를 해결하려면 다음을 수행하십시오

$('#textarea').bind("keydown", function(event) { 
    var keycode = (event.keyCode ? event.keyCode : (event.which ? event.which : event.charCode)); 

    data = $('#textarea').val() 

    $('#data').html(data); 

    if (keycode == 13) { 
     $('#data').html(data.replace(/\n/g,"<br />")); 
     return false; 
    } 
}); 
관련 문제