asp.net 以编程方式获取动态内的文本 div

Question

我正在尝试获取有关在 asp 中动态创建的 div 的文本。

下面是我的数据网格创建的 html table 示例：

<table border="1" id="MainContent_dgValues" style="border-collapse:collapse;">
    <tbody><tr>
        <td>Date Modified<td>Comment</td><td></td>
    </tr><tr>
        <td>3/26/2000</td><td id="myEdit" onclick="makeEditable()">My Text</td><td><a href="javascript:__doPostBack('ctl00$MainContent$dgValues$ctl03$ctl00','')">Update</a></td>
    </tr><tr>
    </tr>
</tbody></table>

这是我为 div 动态创建的代码：

 <script >

     function makeEditable() {
         var divTag = document.createElement("div");
         divTag.setAttribute("id", "editdiv");
         divTag.setAttribute("runat", "server");
         divTag.setAttribute("contenteditable", "true");
         var s = document.getElementById("myEdit").innerHTML;
         document.getElementById("myEdit").innerHTML = "";
         var mytext = document.createTextNode(s)
         divTag.appendChild(mytext);
         document.getElementById('myEdit').appendChild(divTag);
         document.getElementById('myEdit').removeAttribute("onclick");
     }
     </script>

这会在 td 中创建一个 contenteditable div，其中显示 My Text

单击 table 上的更新后，我希望在我的代码中获取 div 中的文本：

    protected void dgValues_EditCommand(object source, DataGridCommandEventArgs e)
    {
            // Get div text here
    }

请帮忙。

Answer 1

因为 DIV 只是客户端，你不能将它传递给后端代码。您可以做的是在更新点击时首先捕获客户端点击事件并将 DIV 的内容复制到隐藏字段中。然后当表单回发时 - 隐藏字段的内容将可用于服务器端代码。

Answer 2

谢谢，我能够做到，但还需要做更多的工作。简而言之，我填充了一个 asp 数据网格，我希望用户点击 td（由数据网格生成），他们将能够编辑内容。

我使用了 HTML5 的 contenteditable 但是，它与 td 中的 IE 10 不兼容。因此，使用上面建议的代码和答案，当使用 js 单击 td 时，我做了一个 div。然后，在提交数据网格中的编辑按钮之前，我无法将 div 的内容复制到隐藏的 input。以下是执行此操作所需的额外步骤。

<input enableviewstate="false" id="myComment" type="hidden" runat="server"    />

protected void Page_Load(object sender, EventArgs e) {

        if (!Page.IsPostBack)
        {
        /**
         Create a script when a submit occurs, grabs div and places the text to a hidden input.
         **/
        string scriptKey = "OnSubmitScript";
        string javaScript = "var divTag = document.getElementById('editdiv'); var hiddenInputTag = document.getElementById('MainContent_myComment'); hiddenInputTag.setAttribute('value', divTag.innerHTML); ";
        this.ClientScript.RegisterOnSubmitStatement(this.GetType(), scriptKey, javaScript);
        }
}

protected void dgValues_EditCommand(object source, DataGridCommandEventArgs e)
{
        // Now gets the hidden input value
        String newComment = myComment.Value;

}

asp.net 以编程方式获取动态内的文本 div

asp.net programmatically get text inside dynamic div

html

javascript

asp.net

contenteditable