如何用jquery实现对选中内容的值实行加减操作

<html><head><title></title><metahttp-equiv="Content-Type"content="text/html;charset=g... <html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <script type="text/javascript" src="./jquery.js"></script> </head>
<body>
<table cellpadding="0" cellpadding="0" border="0" width="997" align="center">
<tr> <td align="left">
<table>
<tr> <td class="quick"><A href="#"><FONT color=red>A</FONT></A></td>
<td class="quick"><A href="#"><FONT color=blue>B</FONT></A></td>
<td class="quick"><A href="#">反选</A></td><td class="quick"><A href="#">取消</A></td>
</tr>
</table> </td> </tr>

<tr> <td align="left">
<table cellpadding="0" cellspacing="1" border="0" >
<tr>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
</tr>
<tr>
<td align="right">1</td>
<td><input type="text" name="num[]" value="100" size="12"/></td>
<td align="right">2</td>
<td><input type="text" name="num[]" value="110" size="12"/></td>
<td align="right">3</td>
<td><input type="text" name="num[]" value="120" size="12"/></td>
<td align="right">4</td>
<td><input type="text" name="num[]" value="130" size="12"/></td>
<td align="right">5</td>
<td><input type="text" name="num[]" value="140" size="12"/></td>
</tr>
<tr>
<td align="right">6</td>
<td><input type="text" name="num[]" value="200" size="12"/></td>
<td align="right">7</td>
<td><input type="text" name="num[]" value="210" size="12"/></td>
<td align="right">8</td>
<td><input type="text" name="num[]" value="220" size="12"/></td>
<td align="right">9</td>
<td><input type="text" name="num[]" value="230" size="12"/></td>
<td align="right">10</td>
<td><input type="text" name="num[]" value="240" size="12"/></td>
</tr>
</table>
</td>
</tr>
<tr> <td align="left"> - 10 + </td> </tr>
</body> </html>
如选A，则序号1，3，9项选中，其对应表格背景色改变；如选B，则序号2，4，6项选中，其对应表格背景色改变；其中A,B对应的序号事先已用数组定义好
另，序号1至10也可用鼠标选择，单击其对应序号即选中，当所需的序号选择好后，点击加或减按钮即可对选择的项执行加减操作（如选择的是1，7，8，点击加号后1的值变为110，7的值变为220，8的值变为230）
有没有详细点的回答呀，对高手来讲应该很简单的 展开
 我来答
1个回答
#热议# 上班途中天气原因受伤算工伤吗？
Victoriness
2010-12-03 · TA获得超过707个赞
知道答主
回答量：97
采纳率：0%
帮助的人：84.7万
我也去答题访问个人页
展开全部
给你写好了，很简单，你预览的时候记得引用自己的jQuery文件。
对了，你的table结构有问题，给你稍做了改动。希望对你有用，呵呵

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style type="text/css">
.changeBG{
background-color:#09F;}
input{
background-color:#E6EFF0;}
.quick span{
display:block;
float:left;
cursor:pointer;
padding:3px;}
label{
cursor:pointer;}
</style>
<script src="../scripts/jquery-1.4.js" type="text/javascript"></script>
<script type="text/javascript">
var A=[1,3,9]; //选项A的列表
var B=[2,4,6]; //选项B的列表
$(function(){
$('.quick:contains("A")').click(function(){
change('input',A);});
$('.quick:contains("B")').click(function(){
change('input',B);});
$('.quick:contains("反选")').click(function(){
turnOver();});
$('.quick:contains("取消")').click(function(){
abolish();});
$('.quick span:contains("-")').click(function(){
decrease(10);});
$('.quick span:contains("+")').click(function(){
increase(10);});
$('label').parent().click(function(){
$(this).next().children().toggleClass('changeBG')});
});
function change(str,arr){
for(i=0;i<arr.length;i++)
$($(str).get(arr[i]-1)).addClass('changeBG');}
function abolish(){
$('input').removeClass('changeBG');}
function turnOver(){
$('input').toggleClass('changeBG');}
function increase(num){
var a=$('.changeBG');
for(i=0;i<a.length;i++)
$(a[i]).val($(a[i]).val()*1+num);}
function decrease(num){
var a=$('.changeBG');
for(i=0;i<a.length;i++)
$(a[i]).val($(a[i]).val()*1-num);}
</script>
<title>无标题文档</title>
</head>
<body>
<table border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td align="left">
<table>
<tr>
<td class="quick"><a href="#"><FONT color=red>A</FONT></a></td>
<td class="quick"><a href="#"><FONT color=blue>B</FONT></a></td>
<td class="quick"><a href="#">反选</a></td>
<td class="quick"><a href="#">取消</a></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left">
<table cellpadding="0" cellspacing="1" border="0" >
<tr>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
<th>序号</th>
<th>值</th>
</tr>
<tr>
<td align="right"><label>1</label></td>
<td><input type="text" name="num[]" value="100" size="12"/></td>
<td align="right"><label>2</label></td>
<td><input type="text" name="num[]" value="110" size="12"/></td>
<td align="right"><label>3</label></td>
<td><input type="text" name="num[]" value="120" size="12"/></td>
<td align="right"><label>4</label></td>
<td><input type="text" name="num[]" value="130" size="12"/></td>
<td align="right"><label>5</label></td>
<td><input type="text" name="num[]" value="140" size="12"/></td>
</tr>
<tr>
<td align="right"><label>6</label></td>
<td><input type="text" name="num[]" value="200" size="12"/></td>
<td align="right"><label>7</label></td>
<td><input type="text" name="num[]" value="210" size="12"/></td>
<td align="right"><label>8</label></td>
<td><input type="text" name="num[]" value="220" size="12"/></td>
<td align="right"><label>9</label></td>
<td><input type="text" name="num[]" value="230" size="12"/></td>
<td align="right"><label>10</label></td>
<td><input type="text" name="num[]" value="240" size="12"/></td>
</tr>
</table>
</td>
</tr>
<tr>
<td align="left" class="quick">
<span>-</span>
<span>10</span>
<span>+</span>
</td>
</tr>
</table>
</body>
</html>
本回答被提问者采纳
已赞过 已踩过<
你对这个回答的评价是？
评论 收起
推荐律师服务： 若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询

为你推荐：

下载百度知道APP，抢鲜体验
使用百度知道APP，立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

京ICP证030173号-1   京网文【2023】1034-029号     ©2024Baidu  使用百度前必读 | 知道协议 | 企业推广

辅 助

模 式