有很长一段时间没做Web前端开发了,这几天工作中做一个小项目需要做几个Web页面,其中涉及到一些JS的知识,很多都不怎么熟悉了,花了不少时间才完成工作需求。因此写几篇blog记录下来。
在一个Web页面中,有一个表格,其是根据Struts2的Iterator标签动态生成的,改表格的Html代码如下:
<table width="550" id="serverTab" border="1" cellpadding="0" cellspacing="0" align="left">
<tr bgcolor="#0099CC">
<td width="10%"><div align="center"> ID</div></td>
<td width="25%"><div align="center"> Host</div></td>
<td width="10%"><div align="center"> Port</div></td>
<td width="5%"><div align="center"> Interval(s)</div></td>
<td width="35%"><div align="center"> Comment</div></td>
<td width="20%"><div align="center"> Need Monitoring?</div></td>
</tr>
<s:iterator value="serverListByType" id="serverList" status="status" >
<tr>
<td><div align="left"><s:property value="id"/></div></td>
<td><div align="left"><s:property value="host"/> </div></td>
<td><div align="left"><s:property value="port"/></div></td>
<td><div align="left"><s:property value="interval"/> </div></td>
<td><div align="left"><s:property value="comment"/></div></td>
<td><div align="left">
<select style='width:95px' >
<s:if test="0==need">
<option value='0' >No</option>
<option value='1'>Yes</option>
</s:if>
<s:else>
<option value='1' >Yes</option>
<option value='0'>No</option>
</s:else>
</select>
</div></td>
</tr>
我要获取该表格中,每行select控件的选中值,由于该表格是动态生成,因此不便制定select的ID及name属性。
开始我试图通过以下代码来获取各行的select选中值:
var tab=document.getElementById("serverTab");
var ServerLists="";
for(var rowIndex=1;rowIndex<tab.rows.length;rowIndex++)
{
for(var childIndex = 0; childIndex<tab.rows[rowIndex].cells[5].children.length;childIndex++)
{
var cb= tab.rows[rowIndex].cells[columnIndex].children[childIndex];
var selectvalue = cb.options[cb.selectedIndex].value;
ServerLists+=selectvalue ;
}
}
结果发现cb.options[cb.selectedIndex].value这句话提示错误,根本无法识别options,即在上段代码中,cb根本没有被识别成一个select对象。
在试过其它多种方法后,终于找到了一个正确的获取select值的方法。代码如下:
var selectinput=tab.getElementsByTagName("select");
input[rowIndex].options[input[rowIndex].selectedIndex].text
input[rowIndex].options[input[rowIndex].selectedIndex].value
通过上面的代码就可以拿到动态表格中各行select的值。
也许是JS水平太差了,纠结了一上午才找到这个。。。不容易啊。
分享到:
相关推荐
Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等
Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等) JavaScript 1判断select选项中 是否存在Value="paraValue"的Item 2向select选项中 加入一个Item 3从select选项中 删除一个Item...
原理就是:一般使用遍历的方法,判断每个Radio是否被选中,如果是,再取其值. <form id=userlist method=post action=option.php> <input type=radio name=userid value=1>1 <input type=radio name=...
Javascript DataTables 表格控件,非常好的表格控件,可以在PHP、java、DotNet中使用。
javascript表格控件:Chgrid,简化型.docx
JavaScript 技术: select2控件选择多个数据,以及回显数据的方法 。
Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等)
3.8.6 映射服务端控件值到客户端 55 3.8.7 禁止派生自compositecontrol的控件创建子控件 56 3.8.8 使用createchildcontrols的注意事项 56 3.8.9 不要误解设计元属性defaultvalue 57 3.8.10 在render方法中利用...
javascript动态操作表格 1.添加表格 2.删除表格 3.选种表格 4.支持IE6.0和Firefox浏览器
用JavaScript制作的动态表格,有添加、删除、全选、全不选,有对动态新增的域校验问题,有对新增的域设置readonly问题,还有对新增域中的span进行隐藏问题都有解决,还有对动态表格的讲解PPT一份。
javascript动态添加表格数据行 在很多web应用中,我们会遇到很多需要动态插入多行纪录的地方。比如,在人才网站上,我们填写简历的时候,我们要填写我们的项目经验,我们可以根据自己的实际情况动态的添加条数,这种...
本文实例为大家分享了JavaScript实现表格动态变色的具体代码,供大家参考,具体内容如下 表格分为:表头、表格主体 两部分 当移动到表格主体的行时,移动到哪一行,哪一行就变化颜色,区分我们选中的行数,更...
解决了要动态生成表格行的问题,效果很好。我的项目中就用到了这个效果。
第一篇 javascript控件开发之动态加载
主要介绍javascript获取select标签选中的值方法,比较实用,需要的朋友可以参考下。
<br>表格控件内建脚本支持面向高级用户,控件动态支持脚本语言VBScript, JavaScript等。控件可以主动和被动的执行脚本中的函数,从而可以实现类似于EXCEL软件的表格内数据自动计算和数据获取等扩展功能。通过...
几个经典JavaScript控件, 表格格式的树示例 带合计行的grid表格 Select的JavaScript实现
主要介绍了javascript获取select值的方法,实例分析了javascript获取select元素值的相关技巧,需要的朋友可以参考下
我自己写的,那出来与大家分享:javascript下动态创建表格的三种方式
javascript获取选中文本的测试脚本,选中文本时产生一个按钮,点击按钮显示文本内容