JS 有趣的eval优化输入验证实例代码 |
本文标签:JS,eval,优化输入验证 复制代码 代码如下: //eval就是计算字符串【可以放任何js代码】里的值 //1、 var str1=12+3; eval(str1);//15 //2、 //3、 //4、 //5、eval--->json字符串 1、如果对如上用户名,邮箱验证输入验空,传统的做法 复制代码 代码如下: var flag = true; if (document.getElementById("txtName").value == "") { //写入错误信息 flag = false; } if (document.getElementById("txtEmail").value == "") { //写入错误信息 flag = false; } return flag } -->但是如何有很多需要验证的字段,if会有很多,而且一点都不雅观 2、平静心情,来看看html 复制代码 代码如下: 用户名:<input type="text" id="txtName" name="name" /><br /> 邮箱:<input type="text" id="txtEmail" name="email" value="" /><br /> <input type="button" value="验证" onclick="validateForm()" /> 2.1 看如下代码 复制代码 代码如下: function validateForm() { var nameV = form1.name.value() 3、封装 复制代码 代码如下: function FormField(fieldName, fieldDesc) {//将变化者 属性字段和描述封装起来 this.fieldName = fieldName; this.fieldDesc = fieldDesc; } String.prototype.MyTrim = function () {//去除首尾空格 return this.replace(/^\s+|\s+$/g, ); } function validateForm() { var oUl = document.getElementById("ulError"); oUl.innerHTML = ""; var list = new Array ( //以后只需要验证为空的 只需要在数组中增加一个对象即可 new FormField("name", "用户名"), new FormField("email", "邮箱") ); var flag = true; for (var i = 0; i < list.length; i++) { var fv = eval("form1." + list[i].fieldName + ".value");//执行eval运算 if (fv == null ||!fv.MyTrim()) { //记录错误信息 // var liError = "<li>" + list[i].fieldDesc + "不能为空</li>"; // oUl.innerHTML+=liError; var liError = document.createElement("li"); liError.innerHTML =list[i].fieldDesc + "不能为空"; oUl.appendChild(liError); flag = false; } } } |