js函数实现输入格式的控制

我们制作Web表单时，经常需要输入数字，比如：电话号码。我们可以通过验证用户的输入，如果不是数字的话，提示用户，如“您的输入无效，请重新输入！”或“您输入数字！”等。这种方式虽然可以解决问题，以确保用户输入有效的数字，但是用户体验效果非常差。那么有没有一种方式，即可以给用户完美的体验，用可以实现业务的需要呢！当然有，本文就讲述如何仅用一个JS函数来实现此功能（确保用户输入的为0-9这十个数字，而又不给出别扭的提示）。

实际上，我们可以通过捕获键盘事件（js中的onkeyup()函数即可实现），然后对用户的输入进行检测。如果，满足条件就保留，反之，自动删除，从而保证用户的输入有效。

原始的html表单元素如下：

<input type="text" id="phone" name="phone" />

添加onkeyup()函数之后的代码为：

<input type="text" id="phone" name="phone" onkeyup="value=value.replace(/[^\d]/g," )"/>

是不是很简单呢，如果你要是.net的话，也可以使用另一种方式，如下所示：
原始的.net表单元素如下：

<asp:TextBox ID="phone" runat="server" Width="98%" MaxLength="20" ></asp:TextBox>

添加onkeyup()函数之后的代码如下：

<asp:TextBox ID="txtPhone" runat="server" Width="98%" MaxLength="20" onkeyup="value=value.replace(/[^\d]/g,'')"></asp:TextBox>

上面用户只需要对数字进行验证，因此我们可以把函数内嵌在元素中，但是如果用户的表单中还有一个要求输入金额的字段，该怎么办呢？首先，我们分析一下，金额不仅可以是整数而且还可以是浮点数，这时我们可以通过调用一个js函数来实现，函数如下：

function CheckInputIntFloat(oInput)
{
if('' != oInput.value.replace(/\d{1,}\.{0,1}\d{0,}/,''))
{
oInput.value = oInput.value.match(/\d{1,}\.{0,1}\d{0,}/) == null ? '' :oInput.value.match(/\d{1,}\.{0,1}\d{0,}/);
}
}

那么该函数如何调用呢，可以按下面的方式调用：

html的情况：

<input type="text" id="money" name="money" onkeyup="javascript:CheckInputIntFloat(this);" />

.net的情况：

<asp:TextBox ID="money" runat="server" Width="98%" MaxLength="20" onkeyup="javascript:CheckInputIntFloat(this);"></asp:TextBox>