2

我在 html 中使用文本区域标签，我必须在单独的行中打印成分，但即使使用回车键，当我将文本区域的值传递给变量并打印它时，它也会出现在一行中。

以下是我的代码片段：

<div data-role="fieldcontain">
    <label for="name">Ingredients</label>
    <textarea rows="4" cols="50" id="new_ingredients">

    </textarea>
</div>

$( '#new_recipe' ).live( 'pagebeforeshow',function(event){
    var temp1 = $("#new_ingredients").val();
    $("#testing").text(temp1);
});

<div data-role="page" id="new_recipe">
    <div class="content" id="testing" ></div>
</div>

请帮助我了解当用户按下回车键时如何获取不同行中的数据。提前谢谢您。

4

2 回答 2

3

用这个：

$("#testing").html(temp1.replace(/\n\r?/g, "<br />"));

在文本区域中按“enter”键表示的字符用“\n”表示（有时也用“\n”表示\r）。但是当以 HTML 显示时，它们在视觉上只是一个空格。要显示这些换行符，需要将它们替换为等效的 HTML<br />元素。

由于<br />元素现在被添加到#testing元素的内容中，因此您需要使用.html()，而不是.text()。否则，HTML 将被转义，无法正常显示。

演示：http: //jsfiddle.net/Wkbrn/2/

于 2013-04-09T06:37:48.157 回答
0

试试这个

<script src='http://code.jquery.com/jquery-latest.min.js'></script>
<div data-role="fieldcontain">
        <label for="name">Ingredients</label>
        <textarea rows="4" cols="50" id="new_ingredients">ingredient1&#13;&#10;ingredient2&#13;&#10
        </textarea>
        </div>

<script>
$(document).ready(function(){
var temp1 = $("#new_ingredients").html().replace(/\n/g,"<br>");;
 $("#testing").html(temp1);
})
</script>

<div data-role="page" id="new_recipe">
<div class="content" id="testing" ></div></div>

我修改了脚本只是为了测试

于 2013-04-09T06:51:13.217 回答