You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

ASP.NET如何通过JS在页面所有textarea后插入AutoCorrect用户控件

需求背景
  • 已创建名为AutoCorrect的UserControl,内部集成GridView控件
  • 所属应用共有100个页面,逐页手动添加该UserControl效率过低,计划通过jQuery/JavaScript实现控件自动插入
实现过程中遇到的问题

初始appendChild插入方案失效

页面加载后执行的初始脚本如下:

$(document).ready(function () {
        let OldTextArea = document.querySelectorAll("textarea");
        if (OldTextArea == null)
            return;
        for (let i = 0; i < OldTextArea.length; i++) {
            OldTextArea[i].appendChild(); // 待解决:如何通过appendChild插入UserControl
        }
    });

核心卡点:无法通过appendChild方法将AutoCorrect UserControl插入为textarea的子节点。

待插入的UserControl配置属性如下:

<uc1:AutoCorrect id=AutoCorrect runat=server ShowTimeOut=false ShowMenu=false>
</uc1:AutoCorrect>

现有可正常运行的参考脚本(可获取所有textarea输入内容):

document.querySelectorAll('textarea').forEach((input) => {console.log(input.value);});

动态拼接HTML方案报错

曾尝试调整实现思路:不直接插入UserControl,改为动态构造包含GridView的HTML字符串后插入到textarea节点下,对应代码如下:

$(document).ready(function () {
// DOM加载完成
let OldTextArea = document.querySelectorAll("textarea");
if (OldTextArea == null)
    return;
const content = `<div id="myDropdown">
                         <asp:GridView ID="GridView1" HeaderStyle-BackColor="#3AC0F2" 
                                       HeaderStyle-ForeColor="Red" runat="server" 
                                       AutoGenerateColumns="false" 
                                       OnDataBound="OnDataBound">    
                                <Columns>          
                                    <asp:BoundField 
                                                   DataField="Shortcode" 
                                                   HeaderText="Shortcode" 
                                                   ItemStyle-Width="30" />
                                   <asp:BoundField DataField="ReplaceText"
                                                   HeaderText="Replace Text"
                                                   ItemStyle-Width="100" />
                              </Columns>
                        </asp:GridView>
                  </div>`;

该方案运行时直接抛出报错,无法正常执行,需要可落地的实现方案指导。


内容的提问来源于stack exchange,提问作者DevOpS_PRO_Pro

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.08.30 02:24:21