通过输入中的输入按钮新建行（ASP.NET MVC）答案

【问题标题】：New row by enter button in input (ASP.NET MVC)通过输入中的输入按钮新建行（ASP.NET MVC）
【发布时间】：2017-11-07 04:38:50
【问题描述】：

我的视图中有文本输入

这里是代码

 @Html.TextAreaFor(model => model.Detail, new { @class = "greeting2", data_bind = "textInput: Detail", id = "Detail", placeholder = "Описание" })

我通过 KnockoutJS 显示文本的地方

这是 span 的代码

<p style="font-size: 20px; margin-top: 40px; padding-left: 30px; padding-right: 40px; text-align: center;"><span data-bind="text: Detail"/>
                </p>

这里是knockoutJS代码

 <script type="text/javascript">
    function ViewModel() {
        this.Greeting = ko.observable('');
        this.Detail = ko.observable('');
    };

    var vm = new ViewModel();
    ko.applyBindings(vm);

</script>

当我写文本时一切正常，并且正在检查空格。但是当我单击输入时，文本将进入新行。但它在一行中，就像在屏幕截图上一样。

Screen

如何通过回车创建新行？

【问题讨论】：

标签： javascript jquery asp.net asp.net-mvc knockout.js

【解决方案1】：

这实际上只是一个样式问题，将white-space: pre-wrap 添加到span 元素的样式应该可以解决问题：

<p style="font-size: 20px; margin-top: 40px; padding-left: 30px; padding-right: 40px; text-align: center;"><span data-bind="text: Detail" style="white-space: pre-wrap" /></p>

【讨论】：