关于前端js改变input值的问题

[_zeg]

关于用js来实现添加商品数量的效果：

<tr>
                    <td> </td>
                    <td> </td>
                    <td><b class="f_b">数量：</b><a class="a_biankuang">-</a><input name="" type="text" value="0" class="num_inp"/><a class="a_biankuang">+</a></td>
                    <td><b class="f_b">数量：</b><a class="a_biankuang">-</a><input name="" type="text" value="0" class="num_inp"/><a class="a_biankuang">+</a></td>
                    <td><b class="f_b">数量：</b><a class="a_biankuang">-</a><input name="" type="text" value="0" class="num_inp"/><a class="a_biankuang">+</a></td>
                    <td> </td>
                  </tr>

我要的效果是：在页面不刷新的情况下，点“－”的时候，该input的值减1，点“+”的时候，该input的值加1，该怎么各自实现添加功能...

这是参考地址：http://www.txy.net.cn/spot.php?id=164&x=591
就是商城里的添加产品数量，然后价格也随之改变...

这位少侠是用rel来实现的...我看不懂...求高手指点...

[_zeg]

图忒小了...

[_zeg]

额额...脑袋犯糊了

[糊涂浩浩]

如果你要实现的组数不多的话，可以给每个都定义不同的Id很容易实现，如果有很多组的话，建议用jQuery先取得上级的<td>标签，然后再获取子下面的input修改其显示的值。

[_zeg]

[Quote=引用 3 楼 的回复:]

如果你要实现的组数不多的话，可以给每个都定义不同的Id很容易实现，如果有很多组的话，建议用jQuery先取得上级的<td>标签，然后再获取子下面的input修改其显示的值。
[/Quote]
对头...那个网站里就是获取td标签，完了再找input...我没看懂，求解释...

[泡泡鱼_]

<input type="button" onclick="changenums(1,'num')" value="减去数量">
<input type="text" id="num" rel="对应产品的价格">
<input type="button" onclick="changenums(2,'num')" value="增加数量">

<script type="text/javascript">
    function changenums(t,id){
    var _nums=document.getElementById(id).value;//这个是当前的数量
    var _price=document.getElementById(id).getAttribute("rel");//这个是价格
        if(t==1){
            //执行减去数量的操作
        }else{
            //执行增加数量的操作
        }
    }
</script>

[泡泡鱼_]

那个参考网站使用的是jquery

其加减数量的DOM结构为：

<td>
<a  class="a_biankuang" rel="1"  style=" cursor:pointer;">-</a>
<input name="" type="text" value="0" class="num_inp" rel="1" alt="111"/><
<a  class="a_biankuang" rel="1"  style=" cursor:pointer;">+</a>
</td>

其执行加减数量的操作事件绑定代码[注释]

 
//绑定class=a_biankuang的click事件，于是，我们找到了一系列的加号和减号的那种区块
 $(".a_biankuang").click(function (){
    num=$(this)  //这个就是加或者减的那个
    .parent()  //回到其父级，也就是找到了<td>标签
    .find("input")  //找下面的input 也就找到了数量的那个input
    .val();//取其值
    rel=$(this)////这个就是加或者减的那个
    .attr('rel');//获取其 rel="这个值"。这个未例中定义：rel=1为减数量,rel=2为加数量
    
    if(rel==1){
        //执行减数量操作
        if(num>0){num--;$(this).parent().find("input").val(num);}	 
    }else{
        //执行加数量操作
        num++;$(this).parent().find("input").val(num);	 
    }
    //下面这句是执行数量*单价运算后在右边显示的功能函数	 
    calculation();	 

})

[泡泡鱼_]

呵呵，上面说那参考网站的DOM结构，顺手打快了

<td>
<b class="f_b">数量：</b>
<a  class="a_biankuang" rel="1"  style=" cursor:pointer;">-</a>
<input name="" type="text" value="0" class="num_inp" rel="1" alt="111"/>
<a  class="a_biankuang" rel="2" style=" cursor:pointer;">+</a>
</td>

[_zeg]

[Quote=引用 6 楼 的回复:]
那个参考网站使用的是jquery

其加减数量的DOM结构为：

HTML code
<td>
<a class="a_biankuang" rel="1" style=" cursor:pointer;">-</a>
<input name="" type="text" value="0" class="num_inp" rel="1" alt="111"/><
<a cl……
[/Quote]
我试了，不起作用...
是不是jq里面，用val()来替代value...这个参数不怎么了解..

[_zeg]

[Quote=引用 6 楼 的回复:]
那个参考网站使用的是jquery

其加减数量的DOM结构为：

HTML code
<td>
<a class="a_biankuang" rel="1" style=" cursor:pointer;">-</a>
<input name="" type="text" value="0" class="num_inp" rel="1" alt="111"/><
<a cl……
[/Quote]
我测试的时候..这东西取不到input的值，这个跟数据类型有没有关系？后面num++,必须是数值才能加...input里面的0...被读取的是string类型还是int类型或者char？

[泡泡鱼_]

先加载你的jquery
$(function(){
   $(".a_biankuang").click(function (){
    num=$(this)  //这个就是加或者减的那个
    .parent()  //回到其父级，也就是找到了<td>标签
    .find("input")  //找下面的input 也就找到了数量的那个input
    .val();//取其值
    rel=$(this)////这个就是加或者减的那个
    .attr('rel');//获取其 rel="这个值"。这个示例中的定义：rel=1为减数量,rel=2为加数量
    
    if(rel==1){
        //执行减数量操作
        if(num>0){num--;$(this).parent().find("input").val(num);}     
    }else{
        //执行加数量操作
        num++;$(this).parent().find("input").val(num);     
    }
    //下面这句是执行数量*单价运算后在右边显示的功能函数     
    //calculation();     

})
})

<td>
<b class="f_b">数量：</b>
<a  class="a_biankuang" rel="1"  style=" cursor:pointer;">-</a>
<input name="" type="text" value="0" class="num_inp" rel="1" alt="111"/>
<a  class="a_biankuang" rel="2" style=" cursor:pointer;">+</a>
</td>

你用了jquery，你总不至于：num=$(this).parent().find("input").value这样来取值吧？？