向 div 的 InnerText 属性添加换行符答案

【问题标题】：Adding a newline character to InnerText property of div向 div 的 InnerText 属性添加换行符
【发布时间】：2013-05-22 18:37:51
【问题描述】：

我有一个按钮单击事件，它应该从文本框中获取文本，然后写入同一页面上 div 的 InnerText 属性。文本被输入到 div 中，但它永远不会在新行上。我尝试了以下变体：编辑：对于选择关闭此问题的人，这是在 div 内，而不是在多行文本框内。它们的工作方式不同，因为当我使用多行文本框时，我有这个工作。

protected void Button1_Click(object sender, EventArgs e)
    {

        if (txtCategory.Text.Length > 0)
        {
            StringBuilder sb = new StringBuilder(drugTerms.InnerText);
            sb.AppendLine(txtCategory.Text);
            drugTerms.InnerText = sb.ToString();
            txtCategory.Text = "";
        }

    }


 protected void Button1_Click(object sender, EventArgs e)
    {

        if (txtCategory.Text.Length > 0)
        {
            StringBuilder sb = new StringBuilder(drugTerms.InnerText);
            sb.Append(txtCategory.Text).Append(Environment.NewLine);
            drugTerms.InnerText = sb.ToString();
            txtCategory.Text = "";
        }

    }

aspx

<%@ Page Language="C#" AutoEventWireup="true" Inherits="_Default" Codebehind="Default.aspx.cs" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>AutoComplete Text Box with jQuery</title>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"
        rel="stylesheet" type="text/css" />
    <link href="StyleSheet1.css" rel="stylesheet" type="text/css" />
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            SearchText();
        });
        function SearchText() {
            $(".auto").autocomplete({
                source: function (request, response) {
                    $.ajax({
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        url: "Default.aspx/GetAutoCompleteData",
                        data: "{'CategoryName':'" + document.getElementById('txtCategory').value + "'}",
                        dataType: "json",
                        success: function (data) {
                            response(data.d);
                        },
                        error: function (x) {
                            alert("Error Occurred");
                        }
                    });
                }
            });
        }
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div class="demo">
        <div class="ui-widget">
            <label for="tbAuto">
                Enter Drug&nbsp; Name:
            </label>
            <asp:Button ID="Button2" runat="server" OnClick="Button1_Click" Text="Button 2" />
            <asp:TextBox ID="txtCategory" CssClass="auto" runat="server"></asp:TextBox>
            <asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button 1" />
            <div id="drugTerms" runat="server"></div>




        </div>
    </div>



    </form>
</body>
</html>

我也尝试在它们中添加一个 html 换行符。每次单击按钮时，都会添加文本框中的文本，新术语是空格而不是换行符。为什么我不能在这个 div 中添加换行符？

【问题讨论】：

Textbox with "new line" 的可能副本 - 编辑：应该戴上老花镜（但只显示相关代码也有帮助）。这不是重复的。

标签： c# asp.net

【解决方案1】：

使用"<br>" 代替Environment.NewLine

【讨论】：

我试过了，但它没有将其解析为 html，因为它只附加了文本 <br/>
@wootscootinboogie 使用 InnerHtml 而不是 InnerText
我必须使用 InnerHtml 属性和 Append("
")。我不知道为什么 AppendLine 不起作用。它正在添加带有空格而不是换行符的项目

【解决方案2】：

您是否尝试过使用新的 Literal 和 PlaceHolder？

aspx：

<asp:PlaceHolder ID="ph" runat="server' visible="true"></asp:PlaceHolder>

那么您的代码将如下所示：

c#:

Literal literal = new Literal(); 
lit.Text = "<br/>";
ph.Controls.Add(lit);

我实际上很喜欢@I4V 使用环境换行符换行符的解决方案。

【讨论】：