提交的验证方法（通过单个字符比较）：

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

    VerifyDate

    <form id="form1" action="VefifyData.html">

        <input type="text" name="d1" /> <input type="submit" />

    </form>

    <script type="text/javascript">

        document.getElementById("form1").onsubmit = function chkForm() {

            var text = this.d1.value;

            alert(text.length);

            for (i=0;i<text.length;i++) {

                alert(i+"的字符是"+text.charAt(i));

                if (text.charAt(i) > '9' || text.charAt(i) < '0') {

                    alert("第 " + i + " 个为非数字字符 "+text.charAt(i));

                } else {

                    alert("第 " + i + " 个为数字字符"+text.charAt(i));

                }

            }

            return false;

        }

    </script>

</body>

</html>

提交验证方法（通过正则表达式）

js中用pattern.test(需要验证字符串) pattern是正则表达式

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

    VerifyDate

    <form id="form1" action="VefifyData.html">

        <input type="text" name="d1" /> <input type="submit" />

    </form>

    <script type="text/javascript">

        document.getElementById("form1").onsubmit = function chkForm() {

            var text = this.d1.value;

            if(verifyData(text)){

                alert("全部为数字...");

                return false;

            }else{

                alert("不全部为数字...");

                return false;

            };

        }

        function verifyData(text){

            var dataPattern=/^\d[0-9]{0,}$/;

            return dataPattern.test(text);

        }

    </script>

</body>

</html>

提交之前验证的方法

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>Insert title here</title>

</head>

<body>

    VerifyDate

    <form id="form1" action="http://www.cnblogs.com/qingyundian" onsubmit="return chkForm()">

        <input type="text" id="d1" /> <input type="submit" />

    </form>

    <script type="text/javascript">

        function chkForm() {

            var text = document.getElementById("d1").value;

            alert(text);

            if(verifyData(text)){

                alert("全部为数字...");

                alert("校验成功，之后进行提交...");

                return true;

            }else{

                alert("不全部为数字...");

                alert("校验失败，不进行提交");

                return false;

            }

            return false;

        }

        function verifyData(text){

            var dataPattern=/^\d[0-9]{0,}$/;

            return dataPattern.test(text);

        }

    </script>

</body>

</html>

这种方法会先校验

校验成功会 返回true 给onsubmit

校验失败会 返回false给onsubmit

校验成功 打开激活网页

java Html&JavaScript面试题：HTML 的 form 提交之前如何验证数值文本框的内容全部为数字? 否则的话提示用户并终止提交?的更多相关文章

  1. iHTML 的 form 提交之前如何验证数值文本框的内容全部为数字

    <input type="text" id="d1" onblur=" chkNumber (this)"/> <scri ...

  2. 面试题之HTML 的 form 提交之前如何验证数值文本框的内容全 部为数字? 否则的话提示用户并终止提交?

    <!DOCTYPE html> <html> <head> <meta charset="{CHARSET}"> <title ...

  3. asp.ne如何使用javascript去验证客户端信息，如果验证成功则送往服务器端处理，否则在客户端提示用户（不返回到服务器端处理）

    一.问题 在网站一般都有很多地方需要用户去填写一些信息,然后用户点击提交,将信息送往后台储存到数据库中.在这一个过程我以前做法直接在button的click事件中来判断用户输入的数据是否完整和合法,虽 ...

  4. java Html&JavaScript面试题：判断第二个日期比第一个日期大

    如何用脚本判断用户输入的的字符串是下面的时间格式2004-11-21 必须要保证用户的输入是此格式,并且是时间,比如说月份不大于12等等,另外我需要用户输入两个,并且后一个要比前一个晚,只允许用JAV ...

  5. java Html&JavaScript面试题：用table显示n条记录，每3行换一次颜色，即1，2，3用红色字体，4，5，6用绿色字体，7，8，9用红颜色字体。

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. 用java的io流，将一个文本框的内容反转

    import java.io.*; import java.util.ArrayList; public class test04 { public static void main(String a ...

  7. JavaScript实现点击复制按钮复制文本框的内容，兼容IOS

    <lable> <input type="text" id="txt"> <a href="javascript:;&q ...

  8. Java+Selenium向文本框输入内容以后模仿键盘的"ENTRY"

    在自动化测试中我们避免不了要模仿一些键盘上按钮的操作,普通的字母,数字,特殊符号,这些都是很简单的,有时候我们也会模仿"SHIFT","ALT","C ...

  9. mvc ---- ajax 提交 （ckeditor）富文本框 提示潜在危险 Request.Form

    ajax 提交 ckeditor 中的内容怎么提交都提交不了,折腾半天,后来终于找到问题 在你的方法头上加 [HttpPost] [ValidateInput(false)] public Actio ...

随机推荐

  1. 虚拟机上安装Cell节点（12.1.2.3.3）

    安装介质下载 打开firefox,输入:https://edelivery.oracle.com 点击"Sign In",输入帐号.密码,登陆edelivery网站.       ...

  2. 原生JS轮播-各种效果的极简实现（二）面向对象版本的实现和优化

    之前写了一篇原生JS轮播,不过是非面向对象的,并且也没有添加上自动轮播.这里来写一下如何优化和进阶. 这里简单地介绍一下之前的代码,这是html结构 <body> <div clas ...

  3. PHPExcel探索之旅---阶段三 绘制图表

    利用PHPExcel插件进行绘制图表 <?php /** * 使用PHPExcel插件在excel文件中利用其中的数据建立折线图 * */ $dir = dirname(__FILE__); r ...

  4. AD按键-矩阵按键-独立按键：

    原理:利用数组分压+AD采集: 优点:一个IO口可以做成多个按键,节省IO口(矩阵键盘在>4时优点才能体现出来):可备用作为AD基准输入. 缺点:不能做成组合按键(或者电阻要精确选择):且离IO ...

  5. 在myecplise中更新代码发布后没效果

    requestmapping指定路径不能访问: 重新发布,重新访问,清除缓存,重新访问,重启浏览器,清除缓存,重新访问,清除Tomcat相关目录,重新发布,重新访问……折腾了很久,可还是没有解决问题. ...

  6. 使用jQuery实现文本框input定位到文字最后（兼容所有浏览器）

    $.fn.setCursorPosition = function(position){ if(this.lengh == 0) return this; return $(this).setSele ...

  7. Spring整合Struts2 XML版

    1.jar包 <!--spring配置--> <dependency> <groupId>org.springframework</groupId> & ...

  8. 使用.NET配置文件appSettings元素的File属性

    今天又一次郁闷了,看Orchard真实学到不少东西哇! Web.Config里面appSettings节点原来可以直接引用一个文件,以前还老想着微软真二,配置节点多了肿么办? 本质上来说,每一个可执行 ...

  9. android打开文件、保存对话框、创建新文件夹对话框(转载)

    转载地址:点击打开 这是一个简单的只有3个按钮的程序,3个按钮分别对应三种工作的模式(保存.打开和文件夹选择).封装的SimpleFileDialog.java的内容如下: package com.e ...

  10. Spring AOP初步总结(三)

    最近遇到一个新需求:用户多次点击提交订单发生多次扣款,一开始准备配置数据库事务,但后来发现这种方法白白浪费很多资源,就改为利用接口上的切面对请求做拦截,并将当前登陆的用户存进Redis缓存,废话不说了 ...