时间戳

首页 > 解决方案 > 如何在 ASP.NET 中使用 innerhtml 制作按钮事件

html - 如何在 ASP.NET 中使用 innerhtml 制作按钮事件

问题描述

我尝试了很多东西，但 innerhtml 只是没有转到 onclick 功能。我使用 mysql 数据库并将 innerhtml 放在一个数据阅读器中，这一切都很好。唯一的问题是我不能点击 html 按钮并且 asp:buttons 没有出现（也尝试过 linkbuttons、onserverclick 等）。我需要 onclick 函数而不是 javascript，因为 sql 在 javascript 中不起作用。谁能帮我？

我试着像这样使用它：

while(dr.read())
{
    ...
    WinkelmandBody.InnerHtml += "<td style='float:right'><button runat='server' onserverclick='btnTrash_Click'><i class='fa fa-trash'></i></button></td>";

并尝试：

    WinkelmandBody.InnerHtml += "<td style='float:right'><asp:LinkButton style='height:50px;width:50px' id='btnTrash' onClick='btnTrash_Click'><i class='fas fa-trash'></i></asp:LinkButton></td>";
}

onclick thingy（我通常在调试模式下检查）：

protected void btnTrash_Click(object sender, EventArgs e)
        {
            Response.Write("<script>alert('test')</script>");
        }

html:

    <tbody>
                            <div id="WinkelmandBody" runat="server">
                            </div>
                            <tr>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td></td>
                                <td>Sub-Totaal</td>
                                <td class="text-right" runat="server" id="SubTotaal"></td>                      
</tr>   
    </tbody>

这些都起作用了，只是按钮不起作用：

WinkelmandBody.InnerHtml += "<tr>";
                    WinkelmandBody.InnerHtml += $"<td><img src='imgs/{dr[2]}' style='height: 50px; width: 50px; '/> </td>";
                    WinkelmandBody.InnerHtml += $"<td>{dr[1]}</td>";
                    WinkelmandBody.InnerHtml += $"<td>{stock}</td>";
                    WinkelmandBody.InnerHtml += $"<td style='text-align:center; border:none'><input style='text-align:center' type='text' value='{dr[0]}' /></td>";
                    WinkelmandBody.InnerHtml += $"<td style='text-align:right'>{ Convert.ToInt32(dr[3]) * (Convert.ToInt32(dr[0])) }€&lt;/td>";

标签： htmlasp.netwebformsinnerhtml

解决方案

您不能在运行时在 ASP.NET WebForms 中创建“服务器端标记”。您应该以编程方式添加控件，而不是设置InnerHtml或发出标记脚本：

.aspx 文件：

<form id="form1" runat="server">
    <div id="WinkelmandBody" runat="server">
    </div>
</form>

cs 文件：

private void SomeMethod()
{
    var table = new Table();
    var headerRow = new TableHeaderRow();
    table.Rows.Add(headerRow);
    // other code for header row ...

    var row = new TableRow();
    table.Rows.Add(row);
    var cell = new TableCell();
    row.Cells.Add(cell);
    cell.Style["float"] = "right";
    Button btnTrash = new Button();
    btnTrash.Text = "Trash";
    btnTrash.Click += BtnTrash_Click;

    WinkelmandBody.Controls.Add(table);
}

此外，代替Response.Write，使用RegisterStartupScript：

private void BtnTrash_Click(object sender, EventArgs e)
{
    var script = "alert('test');";
    ClientScript.RegisterStartupScript(this.GetType(), "alert", script, true);
}

为什么你的代码不起作用

当您添加runat="server"到 aspx 文件中的标记时，ASP.NET 会在第一次加载页面时为该标记创建一个相应的对象。runat="server"渲染页面时不处理。它在解析“aspx”或“ascx”文件时进行处理。因此，您不能以编程方式在标记文本中添加服务器端控件。

推荐阅读