动态添加或减少文本框,并获取文本框值

简介: 原文:动态添加或减少文本框,并获取文本框值很早之前,Insus.NET有实现过《点击一次铵钮产生一个新文本框,分别输入值,然后获取》http://www.cnblogs.com/insus/archive/2012/09/24/2700658.html 。
原文: 动态添加或减少文本框,并获取文本框值

很早之前,Insus.NET有实现过《点击一次铵钮产生一个新文本框,分别输入值,然后获取http://www.cnblogs.com/insus/archive/2012/09/24/2700658.html 。今天想再次演练它,不过是在asp.net mvc的环境之下,使用jQuery来实现。不使用web控件。

创建一个视图操作:



在视图中,放置两个铵钮和两个Div标签,当用动态加载的容器:



在视图中,添加jQuery的引用:

 <script src="~/Scripts/jquery-2.1.0.js"></script>


添加和减少文本框:



上面#37行代码,当点击添加一个文本框之后,产生的html的结构如下:



获取文本框的值:



看看实时演示效果:



目录
相关文章
|
1月前
|
JavaScript 前端开发 索引
JQuery样式操作、click事件以及索引值-选项卡应用示例
JQuery样式操作、click事件以及索引值-选项卡应用示例
20 1
|
12天前
textarea文本框根据输入内容自动适应高度
textarea文本框根据输入内容自动适应高度
12 0
|
5月前
|
JavaScript
checkbox选中和取消,控制dom元素颜色变化
checkbox选中和取消,控制dom元素颜色变化
26 0
|
11月前
|
API
Vue2.x-02根据条件动态设置下拉框、时间选择器、文本框是否可编辑
Vue2.x-02根据条件动态设置下拉框、时间选择器、文本框是否可编辑
169 0
Vue2.x-02根据条件动态设置下拉框、时间选择器、文本框是否可编辑
|
JavaScript
Vue表单中判断当前行输入框的值与整个表单的输入框的值是否重复(过滤自身数据)
使用Element输入框自带change事件获取到scope.$index以及input框中的值(@change="change(scope,$event)"); 使用forEach遍历整个表单的数据(item是需要遍历的数组,index是数组中元素的下标);
432 0
Vue表单中判断当前行输入框的值与整个表单的输入框的值是否重复(过滤自身数据)
javascrip 修改元素属性 - 切换图片
javascrip 修改元素属性 - 切换图片
58 0
javascrip 修改元素属性 - 切换图片
|
人工智能 C#
c#中在datagridview的表格动态增加一个按钮方法
c#中在datagridview的表格动态增加一个按钮方法,如果想要这一套教程的可以移步去这里 《期末作业C#实现学生宿舍管理系统》,对了最近我们有一个人工智能交流群,如果大家对代码有问题,想交流的可以进群,私聊我就可以了! 效果图片 : 在Load事件中写入代码 那ui有了功能怎么办呢?别急我们在 dataGridView1_CellContentClick事件中添加方法 这样的话 我们就可以点击对应行的修改来获取到id的值这里有一个bug就是第三行没数据需要隐藏,现在还没有解决,欢迎大家指出!.....
546 0
c#中在datagridview的表格动态增加一个按钮方法
|
JavaScript 前端开发
页面一刷新让文本框自动获取焦点-- 和自定义v-focus指令
页面一刷新让文本框自动获取焦点-- 和自定义v-focus指令
|
JavaScript
vue增加按钮到表头单元格的解决方法
最近想在明细表中,增加一个增加按钮,记录方法如下: 修改表格的渲染方法 ...
2077 0
|
JavaScript
jquery操作radio单选按钮,实现取值,动态选中,动态删除的各种方法
  本文主要讲的是在jquery里操作表单radio单选按钮的各种方法,如获取选中的radio的值,动态选中指定的radio项等。 1.获取选中的radio单选按钮的值: var v=$(":radio[name='aijquery']:checked").
1560 0