第一种方法:

<!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. 0xC015000F：正被停用的激活上下文不是最近激活的

    项目程序运行的时候,突然出现这个错误,调用堆栈中的函数,没有一个是自己写的,非常困惑. 在网上搜索了一下,先找到一个提示,可以在CApp::InitInstance()中禁用ActivationCon ...

  2. 《Thinking in Java》 10~

    chapter 10 内部类(P191) 创建内部类 链接到外部类 内部类能访问器外围对象的所有成员,而不需要任何特殊条件. 使用.this与.new package cn.test; public ...

  3. java并发编程（更新）

    概念理解:①串行程序②并发程序: 线程安全问题: 同一进程中的所有线程共享进程中的内存地址空间.如果没有明确的同步机制来管理共享数据,那么当一个线程正在使用某个变量时,另一个线程可能同时访问这个变量, ...

  4. 使用jmeter做简单的场景设计

    使用jmeter做简单的场景设计 Jmeter: Apache JMeter是Apache组织开发的基于Java的压力测试工具.用于对软件做压力测试.我之所以选择它,最重要的一点就是----开源 个人 ...

  5. linux系统root用户登录提示“鉴定故障”的解决办法

    同事第一次创建虚拟机,遇到此问题,此前我未曾遇到,搜索到的解决办法记录在此,以防之后忘记. 一.重启系统解决(搜索到的该解决办法较多):https://www.cnblogs.com/lippor/p ...

  6. centos7 yum安装配置redis

    1.设置Redis的仓库地址 yum install epel-release 2.安装redis yum install redis 修改配置文件,监听所有的IP地址 vim /etc/redis. ...

  7. 【智能算法】超详细的遗传算法(Genetic Algorithm)解析和TSP求解代码详解

    喜欢的话可以扫码关注我们的公众号哦,更多精彩尽在微信公众号[程序猿声] 文章声明 此文章部分资料和代码整合自网上,来源太多已经无法查明出处,如侵犯您的权利,请联系我删除. 00 目录 遗传算法定义 生 ...

  8. Python描述符深入理解

    Python的描述符乍眼看去简单,但是细节方面如果不注意容易掉坑,总结以下几个坑,以作备忘,先看代码: class D: def __get__(self, inst, owner): if inst ...

  9. linux vmalloc和kmalloc

    kmalloc是内核低端内存的分配,而vmalloc对应内核高端内存的分配.kmalloc()分配的内存处于3GB-high_memory之间,这一段内核空间与物理内存的映射. kmalloc保证分配 ...

  10. PHP编程入门与应用

    基础语法.流程控制语句.数组的应用.字符串的应用————3天 PHP函数————3天 面向对象————3天 文件处理————2天 获取页面数据.会话处理————3天 数据库————5天 XML和JSO ...