在上一篇的基础上添加了一个小功能,验证文本框是否为空和数字

效果图

页面代码:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><title>简单js验证</title><style type="text/css">body{background-color: White;}input{background-color: white;}</style><script type="text/javascript">var _errorimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAYBQTFRF8lxf82Nm82Rn9YeI8E9W8FBX7lhd8ltf8Vtg8mds725z621x8HN39Xp/9XyA7UdR8U1W8U5W3UpU3ktT309X9W119G11uxIgwh8rzik4xis27jtI0ThF3UBN8U5a61Vg9GBt01Zf3GlyyBYpyBgqyBgryBkrwhwt5C9A12Nu33aBziI535ql5qu1yl1Jzm5ewltM94mA96KayUc+9n959oB59oiA4GFb9XZy83l07Xl1+IuI8YyJ8mZm829t7YKA94uJ8IeF/7+/27a248TEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAFapVIAAAAIB0Uk5T/wD///+SDBJ4AAAAxElEQVQoU12QaRPBQAyG100P66baonVV0ZZ102Ir/v9PklU+8E6SSZ6ZdyYJef6JiDkOPMY8/yF6AXy2v67X1z3zExCwy257PG5WJxYIELP7IYIowryzGIHdOIchhxB4eGtYCAw5XSAEgBcLKdlAMCpXUACVajVXHiMYDhzH4QBYnd5QWPq6zkGErveFxTZbFCilnNOmaSNYzqVS9q2SpC3FYq6mqHmUqmhusro7rcuZjFzrzD63PBdWtz0xrMX3uJ8HvABbGy/xBRy6/gAAAABJRU5ErkJggg==";//"img/error.gif";var _infoimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAGBQTFRF/v7/8fL18vP1AkaM/f7/CFSYC12fDFyfDmKkVZC/ttDk+v3/9Pv/9/z/7fL19vz/7PL1+f3//P7/lrbF9fz/+P3/9/3/+/7/9v3/x9TQAAAAAAAAAAAAAAAAAAAAhiSZVQAAACB0Uk5T//8A//+Vml+sAAAAkElEQVQoU2WQiw7CIAxF0W7aFuvGeKzs/z/UlhkT9SYk3JM+LoTjR8F9JwRA6n53kIH4emGCfIKMPCmiBkYj4ehg3oFODN0A0aaq42xEBpCjF1jFvjMagDWlOFpifMIAtVa93zTVujpAFmk6z61JGy1EIqIARRcZQ21tKWBayrnWgz2G3sHO6GY/0f8f9/UBL0rbEWYf5FKOAAAAAElFTkSuQmCC";//"img/info.gif";var _helpimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAGBQTFRF/v7/8fL18vP1zNTe2+Tu/f7/KGKWRHakXYmxX4qxapK3bJS4eZ2+lbLMorvTUICq9fv/+v3/6PD19Pv/9/z/7fL19vz/7PL1+f3//P7/9fz/+P3/9/3/+/7/9v3/d2mbSgAAACB0Uk5T/wBcXBvtAAAAlUlEQVQoU2WQ7Q6CMAxFUcsVP0oZzgFbkfd/S9sZY9T+2XrS3J6t2X6qqb0IIFKvDgRM+x0xHBkQplatGmIjBkAtHQE/4EB40RMuDOhiIwYorP1VVaArOcA0z0G1QxfCHRWUUqw/z6VMDoRiVLUEjXqoGRyN9H16pFhDbW3ONpFTfq11scG8httbrKqP40f9/3FfH/AEw+8Uq/M+gIEAAAAASUVORK5CYII";//"img/help.gif";var _warnigimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAMAAAAoLQ9TAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAYBQTFRF/ttz/tt0/tt2/96B/t6B/+GK/uCK/+KP/uKO/+OX/uSX/+We/+ae/uWe/uae/+en/+u1/uu1/vTW/tJk/uCV/+mz/+3B/+7B//HN//TX//Xc/8Vh/sVh/8Zi/sVi/tSK/9eR/tyf/+Gr/rQ8/rU8/rQ97qs9/rtJ/rpK/rtK/r9U/8FY/sFY/8FZ/sFZ/8Vi/st3/st488R4/tGH/tKI48GL/9uf6siS/+Cre1ETflMUhVgWg1YWflQVhFgXi10ZilwZil0Zj2AbkWEcl2UelGQdmmgfy59jyZxixppgxZlgxZpg0qRn0KNmzJ9kyp5jyJxixpthxJpg06Vo0qRo0qVo0aNnz6JmzqJmzaBly55kyZ1jx5tix5xixZthyKJvzqBlz6FmxZlhzq6F1bye3cy5AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAuvM8FQAAAIB0Uk5TAP8rdbadAAAAvElEQVQoU2NIQwMMEH5qcHAqhAUVCJWSCkYWSPURkgyBKIGoCBMzNZfwRQik+IpaWoqHp8BVRAhYWNkqCSbCBOITRBTtrM34I+OhZvixahk72JtosflBBOLdhdWMnJyN1JiigEqAAv4MyiqGri4GqqqM0SCB+ABmTXUQ0NRg8YgHCsRw6OrpyNu7yWvrarPHAgUCueSkZRVsHBXkZPQ5Y4ACccm8fNw8IMDNnewJMtQryDvJywtEBiWlpQEAuj9KICZnloAAAAAASUVORK5CYII=";//"img/warning.gif";var _topimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABEAAAAJCAYAAADU6McMAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACWSURBVChTY2DAAy6uq44HYXxq8MpdXF9V/+jsvP8gTJZBF9ZXzX/7cNv///9vgfHTS0v+X1xf3U+0i9ANgBkEMhQkh9egu6vK+a9sbTz/4dkeuAtgBhBlEMyAbx9O4DQA3SCQHrirrqyr1b++q+M+MQbADPr8+tB/kKvhBoEC7OfX8/X//98mCb99uL0eGIP5RAc2IYUAVoL/fCeahjAAAAAASUVORK5CYII=";var _leftimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAARCAYAAAAPFIbmAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAC0SURBVChTY2DAAS6tq/a/u6qcH5c8w8V11fGPzs77j1PBlXW1+vdPzPj///8t7IpACm7t73v/59cV7IrQFWCYhE0BiiKQD65sbTwPswIkCcNwh4MUfPtwAi6BVdHlLQ3/CSq6uL4q/9rOtv94rQPZe2F91fyb+3owFGIEJkwhVjchqwYqPA+KDgzfISsCBQeyQpxxB1V4/9WdDbgjGKQbFAMX1le/ByUXnKaBJK6trZaHpScAuOL9o96G5CcAAAAASUVORK5CYII=";//"img/zuo.PNG";var _closeimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAAKCAYAAACNMs+9AAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAACLSURBVChTY5g5c2b8jBkz8hmwAKC4PlC+fs6cOfIMQM57IP4PxPOR1YIUweRAihmgJoIUwhUjKwKyzwPV8IMNQVO8HskWhCKYdWiKQaZjKgIpRrMOw80wq/mRrLsPde9/sCeQrAQpOg+VBFuH7AwQG6wWSREomPRhBoCCC2YykPYHKQS5B0URFsX7AcMorJRqXs2bAAAAAElFTkSuQmCC";var _valueerrorimg = "data:image/png;base64,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";var _valuetrueimg = "data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAAJcEhZcwAACxIAAAsSAdLdfvwAAAAGYktHRAD/AP8A/6C9p5MAAAIISURBVDhPpVNNSFRRGP3e2DiPEV4gjpELoyEsyKSFkHtp5cZwYYuWgZsKUtDESMJIUEudFhJEBKb9aUoICimBo+g4WDEzTaMyluTQIl20CXJz/I4zvpk3Wz843O/nnHPve+8+ASBHwYG4+nqbjZujfrM3Wnm7f/1CcDBZ9Z9gzh5nuVxqbQMRMTo+VZzqTZyPvE+dxPJOEdb+Ggdgzh5n5JBLI4dBXWtp0cNv5+IfUiUI/RHM/RZMbafBnL3JXyUgh1yHgTq62hf8ra+2fJhX8sSWE+M/BO+SgsTuDbzc9IFcauwTaGG2r5wOT/40EUw1YnRD8FoFb1XIdWSNp03H2IYJcqnJNbDufC7fe7Nu2MQX3wXDasT1MAILapgwQK4aWLkGxS0rZXtPYwb6glnBUDSbd88JAmHBMzVoDpX9U4Nih0HTrC/SH3XjUUjQ9TEr5O6s2R+KCwbjbpCbb2A1PLd6Or94MaC7di8J7s2kTbiyZj+gBuSQm/8I5vFy19lr01ayLexBT0Rwf1FwV3fmyrovJuCMHHLzX6KLRzpTd+xy45R389ZSITrCBehaFTz4qkarBWCPM3LIdXxGXgoNt+KE12dU1z4ufFI/5olcnTVBXBn3xNjjjBxy8y8SDYyMCd39iouKS4qaTM4eZ9yI3OxVZpETfByTLykjoIg5e5zZYX/Go/zO+wND/bVOgnA2AAAAAElFTkSuQmCC";var _divbackgroundcolor = "#ffffda";//ffffccvar _divbordercolor = "#C89E60";//"#d1af7b";//000000 #d1af7bfunction body_load(){}//o: 对象的id, t:类型(error,help,info,warning), p:位置(top,left),m:输出消息function showInfo(o,t,p,m){if(!$(o)){return;}var _infobackgroundimg = _infoimg;switch(t){case "E":_infobackgroundimg = _errorimg;break;case "I":_infobackgroundimg = _infoimg;break;case "H":_infobackgroundimg = _helpimg;break;case "W":_infobackgroundimg = _warnigimg;break;}var _newdiv = window.document.createElement("div");_newdiv.style.position = "absolute";var iut = $(o);if($(o + "_newdiv")){$(o + "_newdiv").parentNode.removeChild($(o + "_newdiv"));}_newdiv.style.top = getTop(iut) + "px";_newdiv.style.left = getLeft(iut) + 16 + getWidth(iut) + "px"; var _weizhi = '<img style="position:absolute;left:-7px;top:3px;display:block;" src="'+_leftimg+'" />';if(p == "T"){_weizhi = '<img style="position:absolute; top:-7px; display:block;" src="'+_topimg+'" />';_newdiv.style.top = getTop(iut) + 16 + getHeight(iut) + "px";_newdiv.style.left = getLeft(iut) + "px"; }var _contentText = '<div onselectstart="return false;" οncοntextmenu="return false;" style="border:1px solid #f0f0f0;background-color:#e0e0e0;position:relative;padding-bottom:2px; padding-right:2px; font-size:12px; margin-left:6px; margin-top:0px;"><div style="padding:3px; cursor:default;border:1px solid '+_divbordercolor+';background-color:'+_divbackgroundcolor+';position:relative; margin-left:-6px; margin-top:-6px;"><table cellpadding="0" cellspacing="0" border="0"><tr><td align="right" style="width:18px;" valign="top"><img style="" src="' +_infobackgroundimg+'" />'+_weizhi+'</td><td style="width:3px;"></td><td style="padding-left:3px;padding-right:3px;white-space:nowrap;">'+m+'</td><td style="width:18px; padding-top:0px;" valign="top" align="right"><img src="'+_closeimg+'" οnclick="closeInfo(\''+o+ '\');" style="cursor:pointer;" /></td><td style="width:6px;"></td></tr></table></div></div>';_newdiv.id = o + "_newdiv";_newdiv.innerHTML = _contentText;window.document.body.appendChild(_newdiv);}//o: 对象idfunction closeInfo(o){if($(o + "_newdiv")){$(o + "_newdiv").parentNode.removeChild($(o + "_newdiv"));}}//获取文本框的位置//对象距离左面的距离function getLeft(o){var _oLeft = o.offsetLeft;while(o.offsetParent!=null) { var _oParent = o.offsetParent;_oLeft += _oParent.offsetLeft;o = _oParent;}return _oLeft;}//对象距离上面的距离function getTop(o){var _oTop = o.offsetTop;while(o.offsetParent!=null) { var _oParent = o.offsetParent;_oTop += _oParent.offsetTop;o = _oParent;}return _oTop;}//对象高度function getHeight(o){return o.clientHeight;}//对象的宽度function getWidth(o){return o.clientWidth;}//获取对象function $(o){return window.document.getElementById(o);}//添加事件,o:对象,n:事件名称,f事件方法function addEvent(o,n,f){if(o){if (window.attachEvent) {o.attachEvent("on" + n, f);}else{o.addEventListener(n, f, false);}}}        //验证文本框//文本框获得焦点 p1: 对象id, p2: 输出内容, p3: 类型function txtFocus(p1,p2,p3){removeimage(p1);showInfo(p1,'I','',p2);}//文本框失去焦点 p1: 对象id p3: 输出内容, p2: 类型function txtBlur(p1,p3,p2){addimage(p2,$(p1),p1,p3);closeInfo(p1);}//添加图片p1: 类型(N:数字), p2:对象, p3:对象id, p4:输出内容function addimage(p1,p2,p3,p4){if(p1 == "N"){if(p2.value == "" || isNaN(p2.value)){createImage(p3,"E",p4);}else{createImage(p3,"T",p4);}}else{if(p2.value == ""){createImage(p3,"E",p4);}else{createImage(p3,"T",p4);}}}//移除图片对象: o:对象idfunction removeimage(o){if($(o + "_newimg")){$(o + "_newimg").parentNode.removeChild($(o + "_newimg"));}}//o:名称 , t: 类型,(E:错误,T:正确) , c: 内容function createImage(o,t,c){if(!$(o)){return;}var _infobackgroundimg = _valueerrorimg;switch(t){case "E":_infobackgroundimg = _valueerrorimg;break;case "T":_infobackgroundimg = _valuetrueimg;break;}var _newdiv = window.document.createElement("img");_newdiv.style.position = "absolute";var iut = $(o);if($(o + "_newimg")){$(o + "_newimg").parentNode.removeChild($(o + "_newimg"));}_newdiv.id = o + "_newimg";_newdiv.style.top = getTop(iut) + "px";_newdiv.style.left = getLeft(iut) + 8 + getWidth(iut) + "px"; _newdiv.src = _infobackgroundimg;if(t == "E"){_newdiv.setAttribute("onmousemove",document.all && !document.documentMode ? eval(function(){showInfo(o + "_newimg",'W','',c);}): "showInfo('"+ o + "_newimg','W','','"+c+"');");_newdiv.setAttribute("onmouseout",document.all && !document.documentMode ? eval(function(){closeInfo(o + "_newimg");}):"closeInfo('"+ o + "_newimg');");}else{_newdiv.title = "验证通过";}window.document.body.appendChild(_newdiv);}////文本框加载事件 arry:文本框的集合对象//function textsLoad(arry){if(arry){_t_lis = arry;//为最终查看使用for(var i=0;i<arry.length;i++){var txtid = arry[i][0];var txttxt = arry[i][1];var obj = $(txtid);addimage(arry[i][2],obj,txtid,txttxt);obj.setAttribute("onfocus",document.all && !document.documentMode ?eval(function(){txtFocus(txtid,txttxt,arry[i][2]);}) :"txtFocus('"+txtid+"','"+txttxt+"','"+arry[i][2]+"');");obj.setAttribute("onblur",document.all && !document.documentMode ? eval(function(){txtBlur(txtid,txttxt,arry[i][2]);}):"txtBlur('"+txtid+"','"+txttxt+"','"+arry[i][2]+"');");}}}var _t_lis = null;//获得结果function retrunValue(){if(_t_lis){for(var i=0;i<_t_lis.length;i++){var obj = $(_t_lis[i][0]);if(obj){if(_t_lis[i][2] == "N"){if(obj.value == "" || isNaN(obj.value)){obj.focus();return false;}}else{if(obj.value == ""){obj.focus();return false;}}}}}return true;}</script><script type="text/javascript">window.onload = function(){var txtlist = new Array(new Array("txtname","姓名不能为空!",""),new Array("txtphone","手机号不能为空!",""),new Array("txtage","年龄必须为数字!","N") //参数1: 文本框的id, 参数2: 输出的字符串, 参数3: 为空则是为空判断,如果为N则是数字判断);textsLoad(txtlist);//调用textsLoad(array)方法加载文本}function resubmit(){if(retrunValue()){//调用retrunValue()方法检查是否满足条件alert("提交成功");}else{alert("提交失败");}}</script></head><body><div style=""><input id="txtname" type="text" value="" /><br /><input id="txtphone" type="text" value="110"/><br /><input id="txtage" type="text" value=""/><br /><input type="button" value="提交" id="butsubmit" οnclick="resubmit();" /><div id="detaildiv" οnmοuseοver="showInfo('detaildiv','H','T','这里是帮助按钮!<br>请输入所以的信息!<br><font color=\'red\'>(全部不能为空!)</font><br><font color=\'green\'>(请点击关闭按钮关闭该提示!)</font>');" style="width:20px; height:20px; border:1px solid green; cursor:pointer;float:left;margin-left:8px;margin-right:8px;" align="center">?</div></div></body>
</html>

转载于:https://www.cnblogs.com/weloglog888/archive/2012/12/25/2832794.html

js 自定义title提示框(附加文本框内容验证) (II)相关推荐

  1. php 修改input内容,JS简单获取并修改input文本框内容的方法示例

    这篇文章主要介绍了JS简单获取并修改input文本框内容的方法,结合实例形式分析了JavaScript针对页面元素的获取.赋值等相关操作技巧,需要的朋友可以参考下 本文实例讲述了JS简单获取并修改in ...

  2. 【js】复选框,复选下拉框,文本框勾连

    [js]对常见事件的一个总结 ps: 内容涉及(kendo Ui, jQuery) 如下图所示:要求实现功能点 (1)用户名(复选下拉框,可选择多个)和用户名(文本输入框)相勾连 复选下拉框改变,文本 ...

  3. Java swing 实现下拉框和文本框同步显示

    想要MyEclipse中的swing中实现下拉框和文本框实现,对下拉框创建MouseEvent.ItemEvent.ActionEvent private void xingbieMouseClick ...

  4. Word中的图文框和文本框

    图文框和文本框的区别 图文框和文本框是将文字.表格.图形精确定位的有力工具.若要图形和文字一起进行图文混排,就要用到图文框和文本框. 文本框实质上是一个图形对象.当用户在文档中手工绘制图形后,在其中添 ...

  5. html文本框同步,同步组合框HTML文本框与

    +---------+------------+ | class | name | +---------+------------+ | 10021 | John | | 10027 | Alex | ...

  6. java文本框添加单击事件,组合框和文本框的VBA动态数组单击事件

    嘿所有我有以下VBA代码,允许我在动态创建的组合框和文本框上的用户窗体上有一个点击事件 . 用户窗体: Option Explicit Dim comboboxBoxColct As New Coll ...

  7. HTML文本框(单行文本框,密码文本框)

    单行文本框 <!--单行文本框--> <input type="text" value="" size="100" max ...

  8. js 网页提示框 html文本框,页面版文本框智能提示JS代码

    于是这code便诞生了,如下: 无标题页 var currentIndex=-1;//保存提示框中选择的索引 var sumSearchCount=0;//保存提示框中数据数量 var tempVal ...

  9. JS自定义Title文字提示

    最近遇到个需求,需要给很多的按钮等添加文字提示,风格要保持统一. 然后就写了如上的这个算是小插件吧  给出源代码的百度云盘链接 下面的代码直接使用只差jQuery的引入 [html] view pla ...

最新文章

  1. 将ImageVIew中的图片保存到本地相册中
  2. matlab下的textread()
  3. PHP7 php_memcache.dll下载
  4. 嵌入式linux组件,嵌入式Linux系统的几大组件!
  5. Java @SuppressWarnings注解
  6. Basic Calculator 基本计算器-Leetcode
  7. 实战分享丨MySQL 与Django版本匹配相关经验
  8. oracl的使用命令
  9. 网址采集器-批量URL网站链接提取-批量关键词网站采集
  10. (原創) 如何破解Quartus II 6.0? (IC Design) (Quartus II) (Nios II)
  11. 【第007问 Unity中如何进行UV动画?】
  12. Mac苹果电脑在线重装系统教程
  13. AndroidStudio 实现用户登录注册
  14. 石墨烯具有非常良好的光学特性,可能拥有一个非线性相移的光学非线性克尔效应-供应石墨烯/生态炭复合材料 聚苯乙烯/氧化石墨烯(PS/GO)复合微球 石墨烯-四氧化三铁(Fe_3O_4)微球复合材料
  15. Coinversation 的选择!一文了解 Polkadot 生态中的智能合约
  16. PNG透明图片在IE浏览器中正确显示
  17. C语言 sigchild回收子进程
  18. JavaScript之DOM(中)
  19. 获取表单 input框中输入的值
  20. 计算机网络 构建Web内容的技术

热门文章

  1. 【Map】——HashMap死循环
  2. 智云通CRM:企业大数据如何分类?
  3. python 归一化
  4. Mybatis Plus 代码自动生成器常用配置参考(详细解读)
  5. 长链和短链的区别(转载)
  6. python splinter api整理
  7. Android手机自动化测试工具介绍
  8. Android-取得输入法或者系统标题栏、魅族下部smartbar等的高度
  9. 腾讯qq6.3官方版 v12390 体验版
  10. SECS/GEM300半导体12寸标准通讯设计方案,300mm标准