javascript中如何获得TABLE中某一行指定列的值,并触发一个事件,修改该行另外一列的值?
这个TAB是可以批量处理,可以随意新增一行或删除一行,主要代码如下:<tableid="1"><tr><tdnowrap="true">删除</td><tdnowrap=...
这个TAB是可以批量处理,可以随意新增一行或删除一行,主要代码如下:
<table id="1">
<tr >
<td nowrap="true">删除</td>
<td nowrap="true">产品</td>
<td nowrap="true">折扣</td>
<td nowrap="true">优惠价</td>
<td nowrap="true">数量</td>
<td nowrap="true">总金额</td>
<td nowrap="true">备注</td>
</tr>
<tr type="data">
<td nowrap="true"><span><input type="text" name="PRODID" value="" nullable="0" itemdesc="产品" />
</td>
<td nowrap="true"><span><input type="text" name="DISCOUNT" value="" nullable="0" itemdesc="折扣" />
</td>
<td nowrap="true"><span><input type="text" name="PRICE" value="" nullable="0" itemdesc="优惠价" />
</td>
<td nowrap="true"><span><input type="text" name="COUNT" value="" itemdesc="数量" onchange=getTotalPrice(this)/></span>
</td>
<td nowrap="true"><span><input type="text" name="TOTALPRICE" value="" itemdesc="总金额"/>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><input id="1" class="button" type="button" value="增加" onclick="。。。。">
</td>
<tr>
</table>
我现在想做的是,在每一行修改数量COUNT的时候,触发一个onchange的事件(见上面代码),这个事件可以根据当前COUNT的值和PRICE的值,计算得到TOTALPRICE的值,并付给改行的TOTALPRICE。
请问这个onchange事件的js该怎么写?
先给15分,如果比较满意,将追加30分
一楼的回答太繁琐
二楼的回答不可行(我当前页面不仅这一个table,还有其他table,其他table里也有input标签)
跪求javascript高手,帮帮忙!!!!!! 展开
<table id="1">
<tr >
<td nowrap="true">删除</td>
<td nowrap="true">产品</td>
<td nowrap="true">折扣</td>
<td nowrap="true">优惠价</td>
<td nowrap="true">数量</td>
<td nowrap="true">总金额</td>
<td nowrap="true">备注</td>
</tr>
<tr type="data">
<td nowrap="true"><span><input type="text" name="PRODID" value="" nullable="0" itemdesc="产品" />
</td>
<td nowrap="true"><span><input type="text" name="DISCOUNT" value="" nullable="0" itemdesc="折扣" />
</td>
<td nowrap="true"><span><input type="text" name="PRICE" value="" nullable="0" itemdesc="优惠价" />
</td>
<td nowrap="true"><span><input type="text" name="COUNT" value="" itemdesc="数量" onchange=getTotalPrice(this)/></span>
</td>
<td nowrap="true"><span><input type="text" name="TOTALPRICE" value="" itemdesc="总金额"/>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><input id="1" class="button" type="button" value="增加" onclick="。。。。">
</td>
<tr>
</table>
我现在想做的是,在每一行修改数量COUNT的时候,触发一个onchange的事件(见上面代码),这个事件可以根据当前COUNT的值和PRICE的值,计算得到TOTALPRICE的值,并付给改行的TOTALPRICE。
请问这个onchange事件的js该怎么写?
先给15分,如果比较满意,将追加30分
一楼的回答太繁琐
二楼的回答不可行(我当前页面不仅这一个table,还有其他table,其他table里也有input标签)
跪求javascript高手,帮帮忙!!!!!! 展开
2个回答
展开全部
<input type="text" name="COUNT" value="" itemdesc="数量" onchange=getTotalPrice(this)/>
注意到您的count为text,不太适合使用onchange来触发,这会带来问题。
比如:你的原数量为20,当你想修改为15时,你会:
1、删除20 值变为“”,onchange触发
2、输入1 值变为 1, onchange触发
3、输入5 值变为 15, onchange触发
这样会触发三次,不能满足你触发一次的要求。
应该用onblur来触发。
分析你的业务,你需要计算当前行的,这样可以使用DOM的API来实现
<table border=1>
<tr>
<td>
<input type="text" value="12" onblur="getTotalPrice(this)">
</td>
<td><input type="text" value="13" onblur="getTotalPrice(this)"></td>
<td>
<input type="text" value="25">
</td>
</tr>
<tr>
<td>
<input type="text" value="1" onblur="getTotalPrice(this)">
</td>
<td><input type="text" value="2" onblur="getTotalPrice(this)"></td>
<td>
<input type="text" value="3">
</td>
</tr>
</table>
<script type="text/javascript">
function getTotalPrice(obj){
var c1 = obj.parentNode.parentNode.childNodes[0].childNodes[0].value;
var c2 = obj.parentNode.parentNode.childNodes[1].childNodes[0].value;
obj.parentNode.parentNode.childNodes[2].childNodes[0].value = parseInt(c1) * parseInt(c2);
}
</script>
修改前面两个栏,都会自动修改第三栏
相信合你意思,加分吧
//var items = document.getElementsByTagName("input");
<!-- 楼上牛人:1、指定下标?2、onkeydown -->
//楼主,这还繁?那加分吧,加分定制一个给你
注意到您的count为text,不太适合使用onchange来触发,这会带来问题。
比如:你的原数量为20,当你想修改为15时,你会:
1、删除20 值变为“”,onchange触发
2、输入1 值变为 1, onchange触发
3、输入5 值变为 15, onchange触发
这样会触发三次,不能满足你触发一次的要求。
应该用onblur来触发。
分析你的业务,你需要计算当前行的,这样可以使用DOM的API来实现
<table border=1>
<tr>
<td>
<input type="text" value="12" onblur="getTotalPrice(this)">
</td>
<td><input type="text" value="13" onblur="getTotalPrice(this)"></td>
<td>
<input type="text" value="25">
</td>
</tr>
<tr>
<td>
<input type="text" value="1" onblur="getTotalPrice(this)">
</td>
<td><input type="text" value="2" onblur="getTotalPrice(this)"></td>
<td>
<input type="text" value="3">
</td>
</tr>
</table>
<script type="text/javascript">
function getTotalPrice(obj){
var c1 = obj.parentNode.parentNode.childNodes[0].childNodes[0].value;
var c2 = obj.parentNode.parentNode.childNodes[1].childNodes[0].value;
obj.parentNode.parentNode.childNodes[2].childNodes[0].value = parseInt(c1) * parseInt(c2);
}
</script>
修改前面两个栏,都会自动修改第三栏
相信合你意思,加分吧
//var items = document.getElementsByTagName("input");
<!-- 楼上牛人:1、指定下标?2、onkeydown -->
//楼主,这还繁?那加分吧,加分定制一个给你
展开全部
<table id="1">
<tr >
<td nowrap="true">删除</td>
<td nowrap="true">产品</td>
<td nowrap="true">折扣</td>
<td nowrap="true">优惠价</td>
<td nowrap="true">数量</td>
<td nowrap="true">总金额</td>
<td nowrap="true">备注</td>
</tr>
<tr type="data">
<td nowrap="true"><span><input type="text" name="PRODID" value="" nullable="0" itemdesc="产品" />
</td>
<td nowrap="true"><span><input type="text" name="DISCOUNT" value="" nullable="0" itemdesc="折扣" />
</td>
<td nowrap="true"><span><input type="text" name="PRICE" value="" nullable="0" itemdesc="优惠价" onkeydown="getTotalPrice()" />
</td>
<td nowrap="true"><span><input type="text" name="COUNT" value="" itemdesc="数量" onkeydown="getTotalPrice()"/></span>
</td>
<td nowrap="true"><span><input type="text" name="TOTALPRICE" value="" itemdesc="总金额"/>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><input id="1" class="button" type="button" value="增加" onclick="。。。。">
</td>
<tr>
</table>
<script type="text/javascript">
function getTotalPrice() {
var items = document.getElementsByTagName("input");
if (items[2].value != "" && items[3].value != "") {
items[4].value = items[2].value * items[3].value;
}
}
</script>
<!--楼上让人汗颜-->
<tr >
<td nowrap="true">删除</td>
<td nowrap="true">产品</td>
<td nowrap="true">折扣</td>
<td nowrap="true">优惠价</td>
<td nowrap="true">数量</td>
<td nowrap="true">总金额</td>
<td nowrap="true">备注</td>
</tr>
<tr type="data">
<td nowrap="true"><span><input type="text" name="PRODID" value="" nullable="0" itemdesc="产品" />
</td>
<td nowrap="true"><span><input type="text" name="DISCOUNT" value="" nullable="0" itemdesc="折扣" />
</td>
<td nowrap="true"><span><input type="text" name="PRICE" value="" nullable="0" itemdesc="优惠价" onkeydown="getTotalPrice()" />
</td>
<td nowrap="true"><span><input type="text" name="COUNT" value="" itemdesc="数量" onkeydown="getTotalPrice()"/></span>
</td>
<td nowrap="true"><span><input type="text" name="TOTALPRICE" value="" itemdesc="总金额"/>
</td>
</tr>
</table>
<table width="100%" border="0" cellpadding="0" cellspacing="0">
<tr>
<td><input id="1" class="button" type="button" value="增加" onclick="。。。。">
</td>
<tr>
</table>
<script type="text/javascript">
function getTotalPrice() {
var items = document.getElementsByTagName("input");
if (items[2].value != "" && items[3].value != "") {
items[4].value = items[2].value * items[3].value;
}
}
</script>
<!--楼上让人汗颜-->
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询