首页 > 语言 > JavaScript > 正文

Mootools 1.2教程 输入过滤第一部分(数字)

2024-05-06 14:13:57
字体:
来源:转载
供稿:网友
注意:JavaScript中的输入过滤只是为了保证(客户端)代码顺利执行,并不能替代服务器端的字符串过滤来保护你的应用程序不被注入攻击。
在第四讲的最后的一个例子中,我们从文本输入框获取RGB值,然后使用它们来改变页面背景色,今天我们首先来看看那个例子的部分代码,并以此展开我们这一讲。
rgbToHex()
从技术上讲,rgbToHex()方法实际上是属于Array集合的。由于它是一个来处理数字的数组方法,我们今天来学习一下这个方法。从功能上来讲,rgbToHex()使用起
来很简单:
参考代码:
代码如下:
function changeColor(red_value, green_value, blue_value){
var color = [red_value, green_value, blue_value].rgbToHex();
alert('Converts to : ' + color);
}

这很正常很完美,因为红色、绿色和蓝色的值都是数字。试试,如果当你传入了一些其他意外的东西:
在这个结果的最后你看到了一个“NaN”,NaN代表不是一个数字(
Not a Number)。如果你把颜色的值作为硬编码写在代码里面,这种情况可能不会出现。但是如果你是从一个输入表单获得的这
个值,那么你很可能会碰到这样的情况,你需要去处理这样一些不符合要求的输入值。
toInt()
因此,现在我们需要一种方式确保传给rgbToHex()方法的参数都是数字——这里就需要使用toInt()方法了。toInt()是另一个相对简单的函数。你可以在一个变量上调用它,那么它将尽可能地将它转换成一个整数。
参考代码:
代码如下:
var toIntDemo = function(make_me_a_number){
var number = make_me_a_number.toInt();
alert ('Best Attempt : ' + number);
}

正如你说看到的,toInt()方法并不能处理所有你可以想到的情况,不过幸亏有了MooTools里面另外一个很酷的方法叫做$type(),我们也可以很好地处理那个问题。
$type()
$type()是另外一个来自MooTools的令人不可思议的简单和有用的东西。它可以检查你传入的无论什么变量,然后返回一个字符串,告诉你这个变量是什么类型:
参考代码:
代码如下:
var checkType = function(variable_to_check){
var variable_type = $type(variable_to_check);
alert("Variable is a : " + variable_type);
}

那里还有许多$type()方法可以检测的类型——你可以在这个
Core.$type()文档中找到一个完整的列表。不过现在,我们真正关心的是怎么检测整数。如果我们在
toIntDemo()方法中使用$type()方法,那么我们就可以很容易地处理那些toInt()不能处理的输入了:
参考代码:
代码如下:
var toIntDemo = function(make_me_a_number){
//Try to make the input number
var number = make_me_a_number.toInt();
//If That didn't work, set number to 0
if ($type(number) != 'number'){number = 0;}
alert('Best Attempt : ' + number);
发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表

图片精选