JSP中使用JavaScript动态插入删除输入框实现代码


Posted in Javascript onJune 13, 2014

JavaScript代码:

<script language="javascript"> 
function addrows(){ 
var len = optionlist.rows.length; //得到table的行数 
var obj = optionlist.insertRow(len);//在最后一行插入 
/**插入第一列**/ 
obj.insertCell(0); 
obj.cells(0).innerHTML="选项" + (len+1) + ":<input type=text name=option size=28>"; 
} 
function deleterow(){ 
var len = optionlist.rows.length; 
if(len <= 1) { 
alert("至少要有一个选项"); 
} 
else { 
optionlist.deleteRow(len-1);//删除最后一项 
} 
} 
function getOptionCount(){ 
return optionlist.rows.length; 
} 
</script>

Jsp页面中的关键代码
<input type="button" id="bt1" value="添加选项" onClick="addrows();"> 
<input type="button" id="bt2" value="删除选项" onClick="deleterow();">

设置table的id以便JavaScript中能识别该table
<table id="optionlist"> 
</table>
Javascript 相关文章推荐
List Information About the Binary Files Used by an Application
Jun 11 Javascript
jquery 获取表单元素里面的值示例代码
Jul 28 Javascript
jquery easyui滚动条部分设置介绍
Sep 12 Javascript
纯javascript模仿微信打飞机小游戏
Aug 20 Javascript
JavaScript String(字符串)对象的简单实例(推荐)
Aug 31 Javascript
微信小程序-消息提示框实例
Nov 24 Javascript
使用vue构建移动应用实战代码
Aug 02 Javascript
vue 引入公共css文件的简单方法(推荐)
Jan 20 Javascript
深入理解es6块级作用域的使用
Mar 28 Javascript
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题
Oct 25 Javascript
JS面向对象编程基础篇(三) 继承操作实例详解
Mar 03 Javascript
JS原型对象操作实例分析
Jun 06 Javascript
jquery 新建的元素事件绑定问题解决方案
Jun 12 #Javascript
js动态往表格的td中添加图片并注册事件
Jun 12 #Javascript
jQuery中多个元素的Hover事件解决方案
Jun 12 #Javascript
js获取当前页面的url网址信息
Jun 12 #Javascript
jquery 3D 标签云示例代码
Jun 12 #Javascript
javascript面向对象特性代码实例
Jun 12 #Javascript
如何让浏览器支持jquery ajax load 前进、后退功能
Jun 12 #Javascript
You might like
使用 MySQL 开始 PHP 会话
2006/12/21 PHP
php 获取远程网页内容的函数
2009/09/08 PHP
php中var_export与var_dump的区别分析
2010/08/21 PHP
PHP的引用详解
2015/02/22 PHP
表单提交验证类
2006/07/14 Javascript
js变量作用域及可访问性的探讨
2006/11/23 Javascript
jquery 插件开发备注
2010/08/27 Javascript
javascript学习笔记(四)function函数部分
2014/09/30 Javascript
jqTransform美化表单
2015/10/10 Javascript
基于javascript实现tab切换特效
2016/03/29 Javascript
Highcharts学习之坐标轴
2016/08/02 Javascript
AngularJS实现给动态生成的元素绑定事件的方法
2016/12/14 Javascript
微信小程序中上传图片并进行压缩的实现代码
2018/08/28 Javascript
Spring boot 和Vue开发中CORS跨域问题解决
2018/09/05 Javascript
详解如何用webpack4从零开始构建react开发环境
2019/01/27 Javascript
微信小程序实现简单表格
2019/02/14 Javascript
小程序跳转H5页面的方法步骤
2020/03/06 Javascript
JavaScript实现像雪花一样的Hexaflake分形
2020/07/07 Javascript
Vue中添加滚动事件设置的方法详解
2020/09/14 Javascript
使用python 和 lint 删除项目无用资源的方法
2017/12/20 Python
点球小游戏python脚本
2018/05/22 Python
学生信息管理系统python版
2018/10/17 Python
Python----数据预处理代码实例
2019/03/20 Python
详解使用python3.7配置开发钉钉群自定义机器人(2020年新版攻略)
2020/04/01 Python
TensorFlow2.X使用图片制作简单的数据集训练模型
2020/04/08 Python
解决pycharm debug时界面下方不出现step等按钮及变量值的问题
2020/06/09 Python
html5 video标签屏蔽右键视频另存为的js代码
2013/11/12 HTML / CSS
html5 canvas 实现光线沿不规则路径运动
2020/04/20 HTML / CSS
印尼极简主义和实惠的在线家具店:Fabelio
2019/03/27 全球购物
电大毕业生自我鉴定
2014/04/10 职场文书
中学生英语演讲稿
2014/04/26 职场文书
实习单位意见
2015/06/04 职场文书
房贷收入证明范本
2015/06/12 职场文书
2016年寒假生活小结
2015/10/10 职场文书
Django如何创作一个简单的最小程序
2021/05/12 Python
PostgreSQL怎么创建分区表详解
2022/06/25 PostgreSQL