通过输入(ASP.NET MVC)中的Enter按钮进行新行

Question

我的视图中有文本输入

这是代码

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

以及我通过QuintOutjs

显示文本的位置

这是跨度的代码

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

这是Quintoutjs代码

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

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

屏幕

我如何通过输入来制作新行？

Answer 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>