2013-12-19 86 views
0

我想在keyup中的div中顯示textarea中的值。我無法顯示換行符。我的預覽div中的文本內聯顯示。我嘗試使用替換並將'/ n'替換爲'
',但它只顯示一切內聯。 這是我的html和jQuery代碼。如何在預覽div中顯示文本框的內容?

<input type="textarea" id="mytextarea"></textarea> 
<div id="preview"></div> 

$(document).ready(function() {  

     var content = $('#mytextarea').val(); 

     $('#mytextarea').keyup(function() { 

      if ($('#mytextarea').val() != content) { 
       content = $('#mytextarea').val().replace("\n", "<br />"); 

       $('#preview').text(content);    
      } 
     }); 

}); 

誰能告訴我怎麼可以顯示與換行符預覽格中的文本區的內容?

+0

試試這個職位 http://stackoverflow.com/questions/ 2919337/jqu ery-convert-line-breaks-to-br-nl2br-equivalent –

回答

2

嘗試這樣的事情

JavaScript代碼

$(function(){ 
      var content = $('#mytextarea').val(); 
      $('#mytextarea').keyup(function() { 
       if (this.value != content) { 
       content = this.value.replace(/\n/g, "<br />"); 
        $('#preview').html(content);    
       } 
      }); 
    }) 

HTML代碼

<textarea id="mytextarea"></textarea> 
    <div id="preview"></div> 
+0

@rejash謝謝你的完美。 – Sophonias

0
$(document).ready(function() {  

    var content = $('#mytextarea').val(); 

    $('#mytextarea').keyup(function() { 

     if ($('#mytextarea').val() != content) { 
      content = $('#mytextarea').val().replace(/\\n/g, "<br />"); 

      $('#preview').text(content);    
     } 
    }); 

});

試試這個。

+0

這裏是工作演示的js小提琴http://jsfiddle.net/MyZgX/ –

+0

感謝您花時間在js小提琴中,但在例子中你放在那裏是一個文本框不是一個文本區域和你給的答案產量完全相同的結果我的初始代碼。謝謝你的努力! – Sophonias

+0

@Sophonias請根據您的問題重新檢查它正在使用文本區域的jsfiddle。我試着輸入\ n並將其轉換爲
。但主要的是你應該得到答案,所以如果你從任何來源,偉大和恭喜! –

相關問題