以下是我的代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>小效果</title>
<style>
.type{width:32px;}
</style>
</head> <body>
<div>
<button id="btn1">-</button>
<input type="text" class="type" id="txt">
<button id="btn2">+</button>
</div>
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
<script>
$(function(){
var typeTxt; //只能输入大于1的数字
$("#txt").keyup(function(){
$(this).val($(this).val().replace(/[^1-9.]/g,''));
}).bind("paste",function(){
$(this).val($(this).val().replace(/[^1-9.]/g,''));
}).css("ime-mode", "disabled"); //取值
$("#txt").change(function(){
typeTxt = $("#txt").val();
}) function up(){
typeTxt = $("#txt").val();
if(typeTxt>){ typeTxt-=; $("#txt").val(typeTxt);}
else{ alert("数字不能小于1"); }
}
function down(){
typeTxt = $("#txt").val();
if(typeTxt>=){ typeTxt++; $("#txt").val(typeTxt);}
else{ alert("数字不能小于1");}
}
$("#txt").keyup(function(e){
if(e.keyCode == ){ down(); }
if(e.keyCode == ) { up();}
}); $("#btn1").click(function(){ up(); });
$("#btn2").click(function(){ down(); });
})
</script>
</html>
用的是正则表达式的方法。
下面是主管的代码：
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>无标题文档</title>
<script>
window.onload=function(){
var oInp1=document.getElementById("inp1");
var oInp2=document.getElementById("inp2");
var oInp3=document.getElementById("inp3");
oInp1.onclick=function(){
oInp2.value>?oInp2.value-=:alert("不能小于1");
};
oInp3.onclick=function(){
oInp2.value=parseInt(oInp2.value)+;
}; //大0 48
//大9 57
//小0 96
//小9 105 //退格 8
oInp2.onkeydown=function(ev){
var ev=ev||event;
if(((ev.keyCode< || ev.keyCode>) && (ev.keyCode!=)) && (ev.keyCode< || ev.keyCode>) ){
return false;
}
};
oInp2.onkeyup=function(){
if(this.value< && ev.keyCode!=)
{
this.value=
}
};
}
</script>
</head> <body>
<input id="inp1" type="button" value="-">
<input id="inp2" style=" width:30px; text-align:center;" type="text" value="">
<input id="inp3" type="button" value="+">
<h3>要求</h3>
<ul>
<li>点击加减按钮可以使文本框内数字增减1但不能小于1</li>
<li>文本框内只能输入数字，并且大小键盘都可以，可以用退格键删除文本框里的内容</li>
<li>文本框内不可输入小于1的整数</li>
</ul>
</body>
</html>
再下面，是我不用表达式的方案，不过还有个小bug
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>小效果</title>
<style>
.type{width:32px;}
</style>
</head> <body>
<div>
<button id="btn1">-</button>
<input type="text" class="type" id="txt">
<button id="btn2">+</button>
</div>
</body>
<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
<script>
$(function(){
var typeTxt; //只能输入大于1的数字
$("#txt").keyup(function(){
if(isNaN($(this).val()) || parseInt($(this).val())<){
$(this).val("");
}
else{typeTxt = $(this).val(); }
}); function up(){
typeTxt = $("#txt").val();
if(typeTxt>){
typeTxt-=;
$("#txt").val(typeTxt);
}
else{
alert("数字不能小于1");
}
}
function down(){
typeTxt = $("#txt").val();
if(typeTxt>=){
typeTxt++;
$("#txt").val(typeTxt);
}
else{
alert("数字不能小于1");
}
}
$("#txt").keyup(function(e){
if(e.keyCode == )
down();
if(e.keyCode == )
up();
}); $("#btn1").click(function(){
up();
});
$("#btn2").click(function(){
down();
}); })
</script>
</html>