如何给table里的input赋值

如以下场景，我要根据用户选择的关系自动填充性别

 <table cellspacing="1" cellpadding="0"  align="center" class="tab" BORDER=0 width="70%" style="border-collapse:separate;border-spacing:1;" id="familyTab"><caption>家庭成员及主要社会关系</caption><tr><th width="15%" style="text-align:center;">关系</th><th width="5%"  style="text-align:center;">性别</th></tr>
<tr><td align="center"><select name="Relationship"  onchange="updateSex(1)"><option value="无" >无</option><option value="父亲" >父亲</option><option value="母亲" >母亲</option></select><!--<input type="hidden" name="Relationship"      class="learnvalue" value="" />--></td><td align="center"><input type="text" name="Sex"              class="learnvalue" value="aaa"  readonly="readonly"/></td></tr><tr><td align="center"><select name="Relationship"  onchange="updateSex(2)"><option value="无" >无</option><option value="父亲" >父亲</option><option value="母亲" >母亲</option></select></td><td align="center"><input type="text" name="Sex"              class="learnvalue" value=""  readonly="readonly"/></td></tr></table>

当下拉框change时调用如下方法，直接获取table，往下推出input

 function updateSex(i){//获取tablevar table=document.getElementById("familyTab")//获取定位的数据所在位置，注意i与实际的行数var tr=table.getElementsByTagName("tr")[i]//定位下拉框所在的单元格var rtd=tr.getElementsByTagName("td")[0]//获取下拉框的值var rval=rtd.getElementsByTagName("select")[0].value//定位性别所在的单元格var sextd=tr.getElementsByTagName("td")[1]if(rval=="父亲"){sextd.getElementsByTagName("input")[0].value="男"}else if(rval=="母亲"){sextd.getElementsByTagName("input")[0].value="女"}else{sextd.getElementsByTagName("input")[0].value=""}}

如果我们能够直接指导下拉框就不必这么麻烦（不要问为什么不直接给input附id，这当然可以，此处我只是记录我遇到的方法）

 <table cellspacing="1" cellpadding="0"  align="center" class="tab" BORDER=0 width="70%" style="border-collapse:separate;border-spacing:1;" id="familyTab"><caption>家庭成员及主要社会关系</caption><tr><th width="15%" style="text-align:center;">关系</th><th width="5%"  style="text-align:center;">性别</th></tr>
<tr><td align="center"><select name="Relationship1"  onchange="updateSex(1)"><option value="无" >无</option><option value="父亲" >父亲</option><option value="母亲" >母亲</option></select><!--<input type="hidden" name="Relationship"     class="learnvalue" value="" />--></td><td align="center"><input type="text" name="Sex"              class="learnvalue" value="aaa"  readonly="readonly"/></td></tr><tr><td align="center"><select name="Relationship2"  onchange="updateSex(2)"><option value="无" >无</option><option value="父亲" >父亲</option><option value="母亲" >母亲</option></select></td><td align="center"><input type="text" name="Sex"             class="learnvalue" value=""  readonly="readonly"/></td></tr></table>

对应的js方法如下

 function updateSex(i){//定位下拉框var rtd=$("#Relationship"+i)//获取下拉框的值var rval=rtd[0].value//定位所在的trvar tr=rtd.parent().parent()//找到input所在tdvar sextd=tr.[0].children[1]if(rval=="父亲"){sextd.getElementsByTagName("input")[0].value="男"}else if(rval=="母亲"){sextd.getElementsByTagName("input")[0].value="女"}else{sextd.getElementsByTagName("input")[0].value=""}}

如何给table里的input赋值相关推荐

antd4 table里面表单赋值_vue的组件化——table表格的封装
什么是组件化--组件化是vue.js中的重要思想之一,也是vue的一个强大功能.它提供了一种抽象,让我们可以开发出一个个独立可复用的小组件来构造我们的应用:任何的应用都可以被抽象成一个组件进行复用. ...
element表格里面放图片_Element UI table里上传图片后如何显示在表格里
问题描述写了一个后台管理系统,需求是通过新增按钮,弹出一个dialog来上传图片,详情(文章),视频. 不太明白这整个逻辑怎么实现. 问题出现的环境背景及自己尝试过哪些方法现在的问题就是我在di ...
table中加表单元素怎么验证_element-ui 解决 table 里包含表单验证的问题！
实际项目中的场景,需要在table里做表单的验证,如图效果: 其实问题关键就在于如何给el-form-item动态绑定prop :prop="'tableData.' + scope.$in ...
html里ajax使用、webpy服务在img显示图片、ajax修改table里的数据、$.post()、window,onload、$(button).click、mjpg_streamer
1.ajax的使用,下面是基于webpy完成的例子: 后台相应代码: class AjaxFriendReq:def POST(self):try:i = web.input()#要使用这个get来获 ...
获取input里面的值和给input赋值
1:先做好准备:创建一个MVC,再在MVC里面创建一个控制器,把接口的名称改为控制器的名称,然后在控制器里面建立一个不使用布局页的视图: 创建的视图截图: 2:在上图的div里面设计HTML界面,先设 ...
mysql 清空row_MySQL_TRUNCATE_清空table里的记录
MySQL_TRUNCATE_清空table里的记录 MySQL TRUNCATE 语法 TRUNCATE [TABLE] tbl_name TRUNCATE TABLE empties a tabl ...
bookstrap 怎么用ajax,bootstrap里怎么用ajax请求数据到table里
订单编号:201606011325160011 商户名称:三顺料理自助餐厅配送地址:绍兴路536号三立时代广场1111 联系方式:138123419876 订单来源:饿了吗订单状态:等待接单更新 ...
jQuery 在Table中选择input之类的东西注意事项
jQuery 在Table中选择input之类的东西注意事项: 如果不在td标签中,是不能进行正确选择的: <table id="tblFormId"><tr&g ...
jquery 获取前两个table里的每个tr里面的第二个td
jquery 获取前两个table里的每个tr里面的第二个td $("table:lt(2)>tbody>tr td:nth-child(2)) $("table:lt ...

如何给table里的input赋值

如何给table里的input赋值相关推荐

最新文章

热门文章