当前位置：首页 → 问答吧 → 文本框内的值加减的问题

文本框内的值加减的问题

时间：2010-05-06

来源：互联网

只能针对一个文本框进行加减代码

<title>JavaScript控制文本框的值连续加减</title> <script language="javascript"> var flag1=0; var flag2=0; function NumberInc() { if(flag1==1 && flag2==1) {alert("Error!");} else { if(flag1==1) { document.all.TextBox1.value++; setTimeout("NumberInc()",100); } if(flag2==1) { document.all.TextBox1.value--; setTimeout("NumberInc()",100); } } } function md(obj) { if(obj.id=="Button1") flag1=1; if(obj.id=="Button2") flag2=1; NumberInc(); } function mo(obj) { if(obj.id=="Button1") flag1=0; if(obj.id=="Button2") flag2=0; } </script> <html> <body> <form runat=server> <input id="TextBox1" runat="server" Width="50" CssClass="mybutton" Text=0> <input type="button" ID="Button1" value="＋" onMouseDown="md(this)" onMouseOut="mo(this)" onMouseUp="mo(this)" > <input type="button" ID="Button2" value="－" onMouseDown="md(this)" onMouseOut="mo(this)" onMouseUp="mo(this)" > </form> </body> </html>
提示：您可以先修改部分代码再运行

如果想插入两个以上的加减文本框不行，希望高人指点。。。给出解决方案。

<title>JavaScript控制文本框的值连续加减</title> <script language="javascript"> var flag1=0; var flag2=0; function NumberInc() { if(flag1==1 && flag2==1) {alert("Error!");} else { if(flag1==1) { document.all.TextBox1.value++; setTimeout("NumberInc()",100); } if(flag2==1) { document.all.TextBox1.value--; setTimeout("NumberInc()",100); } } } function md(obj) { if(obj.id=="Button1") flag1=1; if(obj.id=="Button2") flag2=1; NumberInc(); } function mo(obj) { if(obj.id=="Button1") flag1=0; if(obj.id=="Button2") flag2=0; } </script> <html> <body> <form runat=server> <input id="TextBox1" runat="server" Width="50" CssClass="mybutton" Text=0> <input type="button" ID="Button1" value="＋" onMouseDown="md(this)" onMouseOut="mo(this)" onMouseUp="mo(this)" > <input type="button" ID="Button2" value="－" onMouseDown="md(this)" onMouseOut="mo(this)" onMouseUp="mo(this)" > <input id="TextBox2" runat="server" Width="50" CssClass="mybutton" Text=0> <input type="button" ID="Button3" value="＋" onMouseDown="md(this)" onMouseOut="mo(this)" onMouseUp="mo(this)" > <input type="button" ID="Button4" value="－" onMouseDown="md(this)" onMouseOut="mo(this)" onMouseUp="mo(this)" > </form> </body> </html>
提示：您可以先修改部分代码再运行

作者: chen0559 发布时间: 2010-05-06

有必要写那么麻烦？

作者: fenghuif 发布时间: 2010-05-06

<title>JavaScript控制文本框的值连续加减</title> <html> <body> <form runat=server> <input id="TextBox1" runat="server" Width="50" CssClass="mybutton" Text=0> <input type="button" ID="Button1" value="＋"> <input type="button" ID="Button2" value="－"> <input id="TextBox2" runat="server" Width="50" CssClass="mybutton" Text=0> <input type="button" ID="Button3" value="＋"> <input type="button" ID="Button4" value="－"> </form> <script language="javascript"> var $ = function(x){return document.getElementById(x)} $('Button1').onclick = $('Button2').onclick = $('Button3').onclick = $('Button4').onclick = function(){ var n = this.id.slice(this.id.length-1); if(n==1||n==3){ if(n==3)n=2; //alert(/\D/g.test($('TextBox'+n).value)) if(/\D/g.test($('TextBox'+n).value))return alert('不是数值类型'); $('TextBox'+n).value++ }else { if(n==2)n=1; if(n==4)n=2; if(/\D/g.test($('TextBox'+n).value))return alert('不是数值类型'); $('TextBox'+n).value-- } } </script> </body> </html>
提示：您可以先修改部分代码再运行

作者: fenghuif 发布时间: 2010-05-06

引用:

原帖由 fenghuif 于 2010-5-6 10:43 发表
[html]JavaScript控制文本框的值连续加减












var $ = function(x){return document.getElementById(x)}
$('Button1').onclick = ...

如果两个以上或者更多呢，应该如何写？望指教。

作者: chen0559 发布时间: 2010-05-06

如果很多我那么写就不行了，参考这个我写的例子，写个类，然后调用。http://bbs.blueidea.com/thread-2983294-1-1.html

作者: fenghuif 发布时间: 2010-05-06