ASP.NET 动态创建文本框 TextBox (add TextBox to page dynamically)
废话少说,服务端的方法基本上是不可行的,麻烦,没有详细去试,只有依赖于客户端脚本了:
下面的函数每执行一次就生成一个TextBox(其实是<input type="Text">)
var i=0;
function changeIt()
{
if(i<5)
{
i=i+1;
skils='skill'+i;
my_div.innerHTML = my_div.innerHTML +" <input type='text' id='" + skils + "'>";
}
else
{
}
}
function changeIt()
{
if(i<5)
{
i=i+1;
skils='skill'+i;
my_div.innerHTML = my_div.innerHTML +" <input type='text' id='" + skils + "'>";
}
else
{
}
}
我们来之行它:点击以下就添加一个TB:
<a id="addSkills" href="javascript:changeIt();">Add More
</a>

好,文本框是显示出来了,但它是在客户端生成的,不能保存状态,跟服务端无法直接沟通,它们的值我们怎么来取呢?——Hidden Field,老办法。。。
<asp:HiddenField ID="Skills" runat="server" />
function getValues()
{
document.getElementById("Skills").value=document.getElementById('skill1').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill2').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill3').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill4').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill5').value+"|";
window.alert(document.getElementById("Skills").value);
}
{
document.getElementById("Skills").value=document.getElementById('skill1').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill2').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill3').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill4').value+"|";
document.getElementById("Skills").value+=document.getElementById('skill5').value+"|";
window.alert(document.getElementById("Skills").value);
}
这样,就把这些TEXTBox们的值存入了Hidden Field,我们在服务端取一下看看:
<asp:Button ID="Button3" OnClientClick="javascript:getValues();" runat="server"
Text="get from client-side" onclick="Button3_Click"/>
Text="get from client-side" onclick="Button3_Click"/>
protected void Button3_Click(object sender, EventArgs e)
{
string val=this.Skills.Value;
Response.Write(val);
}
{
string val=this.Skills.Value;
Response.Write(val);
}
取出来了:
全部代码在此:


【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 周边上新:园子的第一款马克杯温暖上架
· Open-Sora 2.0 重磅开源!
· 分享 3 个 .NET 开源的文件压缩处理库,助力快速实现文件压缩解压功能!
· Ollama——大语言模型本地部署的极速利器
· [AI/GPT/综述] AI Agent的设计模式综述