TJF框架中增加数量加减控件

天远科技  发表于:2015-08-14  分类:HTML/JS/CSS相关  阅读(7252)  赞同30

随着互联网的发展,界面的要求逐渐提高,HTML基础控件已经不能胜任,不论基于界面的友好度也好,还是网站制作过程中得难易度也好,桐乡天远科技结合多年来的网站制作经验,开发了一套JS框架,试图让界面渲染开发的速度更快,以下是框架中的开关控件实现。

$.fn.extend({
TY_Spinner:function(ismini) {
var myClass = 'TYF_spinner';
if(ismini == 1) {
myClass = 'TYF_mspinner';
}
return $(this).each(function(){
if($(this).attr("type")=="text" && (TY.Text.isfloat($(this))!=true || TY.Text.isint($(this))!=true)) {
var width = 60;
if($(this).attr("min")) var minValue = $(this).attr("min");
if($(this).attr("max")) var maxValue = $(this).attr("max");
if($(this).attr("width")) width = $(this).attr("width");
var mySpinnerHtml = "<span class=\""+myClass+"\" style=\"width:"+width+"px\"><input type=\"text\" name=\""+$(this).attr("name")+"\" id=\""+$(this).attr("id")+"\" value=\""+$(this).val()+"\" style=\"width:";
if(ismini==1) {
mySpinnerHtml += width*1-17;
}else{
mySpinnerHtml += width*1-22;
}
mySpinnerHtml += "px\" />";
mySpinnerHtml += "<span class=\"TYF_spinner_bn\"><span class=\"TYF_spinner_bnup\"></span><span class=\"TYF_spinner_bndown\"></span></span></span>";
var sObj = $(mySpinnerHtml);
$(this).before(sObj);
$(this).remove();
sObj.find(".TYF_spinner_bnup").mousedown(function(){
var _textValue = 0;
if(TY.Text.isint(sObj.children("input")) && TY.Text.isfloat(sObj.children("input"))) {

}else{
_textValue = sObj.children("input").val();
}
if(maxValue) {
if(_textValue*1<maxValue*1) {
sObj.children("input").attr("value",_textValue*1+1);
}
}else
sObj.children("input").attr("value",_textValue*1+1);
});
sObj.find(".TYF_spinner_bndown").mousedown(function(){
var _textValue = 0;
if(TY.Text.isint(sObj.children("input")) && TY.Text.isfloat(sObj.children("input"))) {

}else{
_textValue = sObj.children("input").val();
}
if(minValue) {
if(_textValue*1>minValue*1) {
sObj.children("input").attr("value",_textValue*1-1);
}
}else
sObj.children("input").attr("value",_textValue*1-1);
});
}
});
}
});

前台调用只需$(id).TY_Spinner();

博文分类

线

在线联系
点击这里给我发消息
点击这里给我发消息
关注我们