码迷,mamicode.com
首页 > 移动开发 > 详细

Appcan 自定义数字加减控件

时间:2015-06-26 19:36:47      阅读:180      评论:0      收藏:0      [点我收藏+]

标签:

DIV部分:

*这里的三个ID:as_sub_3、as_now_3、as_add_3里面的“3”可以自定义,这个对于生成任意个数的列表形式很有帮助

                                <div class="ub ub-f1 ub-pe as-height">
                                    <div id="as_sub_3" onclick="as_sub(this)" class="ub ub-pc ub-ac as-border">
                                        <div class="ub">
                                            -
                                        </div>                                        
                                    </div>
                                    <div id="as_now_3" class="ub ub-pc ub-ac as-border">
                                        1
                                    </div>
                                    <div id="as_add_3" onclick="as_add(this)"  class="ub ub-pc ub-ac as-border">
                                        <div class="ub">
                                            +
                                        </div>                                        
                                    </div>
                                </div>

CSS部分:

.as{
    
}
.as-height{
    height: 2em;
}
.as-border{
    border: 1px solid #c4c4c4;
    width: 2em;
}

JS部分:

var as_min=1;
var as_max=10000;
var as_now=2;
function as_add (obj) {
  var id = $(obj).attr("ID");
  var bz = id.split("_")[2];
  if(as_now==10000){
      return;
  }
  as_now++;
  $("#as_now_"+bz).text(as_now);
}
function as_sub (obj) {
  var id = $(obj).attr("ID");
  var bz = id.split("_")[2];
  if(as_now==1){
      return;
  }
  as_now--;
  $("#as_now_"+bz).text(as_now);
}

 

Appcan 自定义数字加减控件

标签:

原文地址:http://www.cnblogs.com/wangliuwei/p/4603049.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!