第一种方法:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form onsubmit="return func1()">                             // 这里的onsunbmit 在函数前面加了个RETRUN
        <input type="text" name="us" id="inp">
        <input type="submit" value="提交" id="sub">
    </form>
<script>
    var inp=document.getElementById("inp");

    function func1() {

        if (inp.value.length<5){                               // 判断输入框输入的如果大于5个字符就通过验证, inp.value 就是 us="" 的值
             alert("验证失败!");                   
              return false;
        }

    }
</script>
</body>
</html>

-----------------------------------------------------------------------------------------------------------------------------------------------------

第二种方法:


<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
    <form id="form">                              // 找到form 标签
        <input type="text" name="us" id="inp">
        <input type="submit" value="提交" id="sub">
    </form>
<script>
    var inp=document.getElementById("inp");
    var ff=document.getElementById("form");    // 用绑定函数的方法 
    ff.onsubmit=function (ev) {
        if (inp.value.length<5){
            alert("验证失败!");
            event.preventDefault();            // 这里是阻止垃圾数据传入的方法
        }
    }
</script>
</body>
</html>

js 中 前端过滤数据到后端的方法的更多相关文章

  1. [转]js中几种实用的跨域方法原理详解

    转自:js中几种实用的跨域方法原理详解 - 无双 - 博客园 // // 这里说的js跨域是指通过js在不同的域之间进行数据传输或通信,比如用ajax向一个不同的域请求数据,或者通过js获取页面中不同 ...

  2. JS中 逻辑或 || 逻辑与 && 的使用方法总结

    JS中 逻辑或 || 逻辑与 && 的使用方法总结 //1.在if判断中 //if(1==1 || 2==3){}//->两个条件中只要有一个条件为真,整体就为真 "或 ...

  3. JS中的call、apply、bind方法

    JS中的call.apply.bind方法 一.call()和apply()方法 1.方法定义 call方法: 语法:call([thisObj[,arg1[, arg2[,   [,.argN]]] ...

  4. JavaScript -- 时光流逝（四）：js中的 Math 对象的属性和方法

    JavaScript -- 知识点回顾篇(四):js中的 Math 对象的属性和方法 1. Math 对象的属性 (1) E :返回算术常量 e,即自然对数的底数(约等于2.718). (2) LN2 ...

  5. node.js中实现同步操作的3种实现方法

    这篇文章主要介绍了node.js中实现同步操作的3种实现方法,本文用实例讲解一些需要同步操作的情况下,如何编程实现,需要的朋友可以参考下 众所周知,异步是得天独厚的特点和优势,但同时在程序中同步的需求 ...

  6. JS中的forEach、$.each、map方法推荐

    下面小编就为大家带来一篇JS中的forEach.$.each.map方法推荐.小编觉得挺不错的,现在分享给大家,也给大家做个参考.一起跟随小编过来看看吧 orEach是ECMA5中Array新方法中最 ...

  7. 手写面试编程题- 数组去重 深拷贝 获取文本节点 设置奇数偶数背景色 JS中检测变量为string类型的方法 第6题闭包 将两个数组合并为一个数组 怎样添加、移除、移动、复制、创建和查找节点？ 继承 对一个数组实现随机排序 让元素水平 垂直居中的三种方式 通过jQuery的extend方法实现深拷贝

    第1题==>实现数组去重 通过 new Set(数组名) // var arr = [12, 12, 3, 4, 5, 4, 5, 6, 6]; // var newarr1 = new Set ...

  8. js中常用追加元素的几种方法

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

  9. 前端必备——js中前端与后台的数据交互全解

    只要编程语言能够支持网卡端口的监听和发送,理论上都是可以实现服务器后台设计的.也因此造成了实现后台的语言偏多,而web前端语言以html/css/js为主.所以在这里我们不涉及后台的设计,只介绍在we ...

随机推荐

  1. 「HNOI2008」越狱

    题目链接 戳我 \(Solution\) 正难则反,这道题直接做有点困难,但我们可以反过来思考我们可以用总方案数减去不可以越狱的方案数 首先来算总方案数: 对于每个房间的人都有\(M\)种宗教可以选, ...

  2. 三、Node.js-HelloWorld案例

    之前我们编写的JavaScript代码都是在浏览器中运行的,因此,我们可以直接在浏览器中敲代码,然后直接运行. 在Node,我们编写的JavaScript代码将不能在浏览器环境中执行了,而是在Node ...

  3. ajaxfileupload 跨域 （二级域名） 可行办法

    ajaxfileupload 跨二级域名 如 aa.fei.com 到 bb.fei.com 是可行的. 1.首先在html页面 ajaxfileupload上方加入 document.domain= ...

  4. cinder侧挂载卷流程分析

    cinder侧挂载卷流程分析,存储类型以lvm+iscsi的方式为分析基础cinder侧主要调用了三个接口1)reserve_volume: 把volume的状态改为attaching,阻止其它节点执 ...

  5. ubuntu14.04，安装Chrome（谷歌浏览器）

    Linux:ubuntu14.04 一直都很喜欢谷歌浏览器,进入linux怎么能没有? 安装方法:谷歌浏览器官方下载的ubuntu版本,下载后点击即可安装. 下载地址:http://download. ...

  6. C#下Excel的普通处理和报表设计

    一.准备:想要操作Excel,先要在添加2个COM引用: 1.Microsoft Excel 14.0 Object Library (版本不同14.0也可能是12.0等) 2.Microsoft O ...

  7. 基于 Django 的手机管理系统

    前段时间和小组一起完成数据库作业,觉得收获挺多的,分享到博客来. 一.概述 打算通过设计数据库,然后结合 Python 框架Django,实现在网页上对数据库的增删改查(本例以手机的管理为例,不考虑订 ...

  8. 题解 P1339 【[USACO09OCT]热浪Heat Wave】

    题目链接 这道题纯属是一个裸的SPFA: 建议先把模板AC之后再做. 只需要做一些手脚,就是在加边的时候加一个双向边就好. 然后再第一次加点的时候 看不懂模板的出门左转度娘. 推荐下面一片讲解: 友链 ...

  9. Java面向对象之USB接口实例

    一.需求: 1.在电脑上设置一个USB接口. 2.电脑运行时,将鼠标连接到接口上,鼠标可以使用自己的功能. 3.电脑运行时,将键盘连接到接口上,键盘可以使用自己的功能.(使用接口的作用:减低鼠标.键盘 ...

  10. C++_异常5-异常规范和栈解退

    异常规范 异常规范的理念看似有前途,但实际的使用效果并不好. 忽视异常规范之前,您至少应该知道它是什么样的,如下所示: double harm(double a) throw(bad_thing);  ...