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

提交的验证方法(通过单个字符比较):

<!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

校验成功 打开激活网页

原文地址:https://www.cnblogs.com/qingyundian/p/8393483.html

时间: 2024-10-28 14:29:29

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

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

<!DOCTYPE html> <html> <head> <meta charset="{CHARSET}"> <title></title> </head> <script type="text/javascript" /> function chkForm(this) { var value = thist.d1.value; var len = value.len

java Html&amp;JavaScript面试题:判断第二个日期比第一个日期大

如何用脚本判断用户输入的的字符串是下面的时间格式2004-11-21 必须要保证用户的输入是此格式,并且是时间,比如说月份不大于12等等,另外我需要用户输入两个,并且后一个要比前一个晚,只允许用JAVASCRIPT,请详细帮助作答, 提示:可用正则表达式提前判断一下格式,然后提取各时间字段内容 写出js及html代码 原文地址:https://www.cnblogs.com/qingyundian/p/8379630.html

用java的io流,将一个文本框的内容反转

import java.io.*; import java.util.ArrayList; public class test04 { public static void main(String args[]) throws IOException { BufferedReader br = new BufferedReader(new FileReader("xxx.txt")); BufferedWriter bw = new BufferedWriter(new FileWri

Java+Selenium向文本框输入内容以后模仿键盘的&quot;ENTRY&quot;

在自动化测试中我们避免不了要模仿一些键盘上按钮的操作,普通的字母,数字,特殊符号,这些都是很简单的,有时候我们也会模仿"SHIFT","ALT","CONTROL",这些Selenium已经提供了Action了,具体如下: Actions actions = new Actions(driver); actions.keyDown(Keys.CONTROL);//按下,松开control actions.keyDown(Keys.CONTROL)

Java 之 JavaScript (二)

1.DOM a.作用:通过 HTML DOM,可访问 JavaScript HTML 文档的所有元素 b.功能: ①JavaScript 能够改变页面中的所有 HTML 元素 ②JavaScript 能够改变页面中的所有 HTML 属性 ③JavaScript 能够改变页面中的所有 CSS 样式 ④JavaScript 能够对页面中的所有事件做出反应 2.获取与更改 a.获取元素: var x=document.getElementById("intro"); //通过id获取元素 v

JS(javascript)动态判断输入文本框剩余可输入字符数

一.描述 我们在空间中发表状态,当我们输入一个字符,上面的剩余可输入字符数就会减一,直到输入的字符数达到之前设定的最大数量为止,效果如下图所示: 二.实现方法 首先,我们先确定文本框内的最大可输入长度,其次在输入一个字符抬起键盘的时候对输入文本框中的字符长度进行验证,并在动态显示在剩余可输入字符数中. 三.源代码 <%@ page language="java" pageEncoding="UTF-8"%> <%@ taglib uri="

Spring MVC-表单(Form)标签-文本框(Text Box)示例(转载实践)

以下内容翻译自:https://www.tutorialspoint.com/springmvc/springmvc_textbox.htm 说明:示例基于Spring MVC 4.1.6. 以下示例显示如何使用Spring Web MVC框架在窗体中使用文本框.首先,让我们使用Eclipse IDE,并按照以下步骤使用Spring Web Framework开发基于动态窗体的Web应用程序: 步骤 描述 1 创建一个名为HelloWeb的项目,在一个包com.tutorialspoint下,如

java 三大框架面试题

1.Hibernate工作原理及为什么要用? 原理: 1.读取并解析配置文件 2.读取并解析映射信息,创建SessionFactory3.打开Session 4.创建事务Transation 5.持久化操作 6.提交事务 7.关闭Session 8.关闭SesstionFactory 为什么要用: 1. 对JDBC访问数据库的代码做了封装,大大简化了数据访问层繁琐的重复性代码. 2. Hibernate是一个基于JDBC的主流持久化框架,是一个优秀的ORM实现.他很大程度的简化DAO层的编码工作

C++、Java、JavaScript中的异常处理(Exception)

编程思想之异常处理 什么叫异常处理? 什么叫异常(Exception)?顾名思义就是非正常的情况,出现了不希望出现的意外,异常处理就是遇到这种意外时准备的对策和解决方案.比如您开着一辆劳斯莱斯在公路上行走,突然前面出现一个小孩,幸好您眼疾手快紧急刹车,而避免了一场交通事故.在这个例子中突然出现的小孩就是异常,紧急刹车就是异常处理(面对这种突发情况采取的解决方案). 程序来源于现实,是现实的抽象和模拟,也会有异常,因此异常的处理就显示的极为重要.试想如果您的手机的某个应用使用两下就崩溃了,或都出现