为了账号安全,请及时绑定邮箱和手机立即绑定

点击增加span 的数字加1,点击减少span减1如何做?

点击增加span 的数字加1,点击减少span减1如何做?

弑天下 2019-04-21 20:15:07
增加减少span的初始值为00,当增加到30是恢复初始值,当减少到00在减少变成30
查看完整描述

2 回答

?
拉风的咖菲猫

TA贡献1995条经验 获得超2个赞

想了想还是不要直接绑定事件了,这样的写法一点营养都没有。
HTML
script
functionComponent(el,options){
this.opts=$.extend({
initVal:0,
maxVal:30
},options);
this.$el=el;
this._currVal=this.opts.initVal;
this.$add=this.$el.find('button:first');
this.$sub=this.$el.find('button:last');
this.$show=this.$el.find('span');
this.render(this._currVal);
this.$add.on('click',$.proxy(this.handleAdd,this));
this.$sub.on('click',$.proxy(this.handleSub,this));
}
$.extend(Component.prototype,{
handleAdd:function(){
this.render(this._currVal+1);
},
handleSub:function(){
this.render(this._currVal-1);
},
render:function(val){
if(val<=this.opts.initVal){
this._currVal=this.opts.initVal;
}elseif(val>=this.opts.maxVal){
this._currVal=this.opts.maxVal;
}else{
this._currVal=val;
}
this.$show.text(this._currVal);
},
getCurrVal:function(){
returnthis._currVal;
}
});
newComponent($('#example'));
newComponent($('#example1'),{
initVal:5,
maxVal:20
});
varcomponent=newComponent($('#example2'),{
initVal:10,
maxVal:30
});
component.getCurrVal();
                            
查看完整回答
反对 回复 2019-04-21
?
狐的传说

TA贡献1804条经验 获得超3个赞

varchange=function(num){
varspan=document.getElementById('cc'),
spanNum=span.innerText*1;
spanNum+=num;
if(spanNum>30){
spanNum=0;
}
if(spanNum<0){
spanNum=30;
}
if(spanNum<10){
span.innerText='0'+spanNum;
}else{
span.innerText=''+spanNum;
}
}
document.getElementById('aa').addEventListener('click',function(e){
change(1);
});
document.getElementById('bb').addEventListener('click',function(e){
change(-1);
});
                            
查看完整回答
反对 回复 2019-04-21
慕课专栏
更多

添加回答

了解更多

举报

0/150
提交
取消
微信客服

购课补贴
联系客服咨询优惠详情

帮助反馈 APP下载

慕课网APP
您的移动学习伙伴

公众号

扫描二维码
关注慕课网微信公众号