表单事件，当用户与表单元素进行交互时发生。

实例：

 1 <!DOCTYPE html>

 2 <html>

 3     <head>

 4         <title>表单事件</title>

 5         <meta charset="UTF-8">

 6         <meta name="viewport" content="width=device-width, initial-scale=1.0">

 7     </head>

 8     <body>

 9         <form id ="myform" action="http://www.163.com/" method="get" >

10             用户名：<input type="text" id="username" name="username" >

11             <button type="submit">提交</button>

12         </form>

13

14         <script>

15             var myform = document.getElementById('myform');

16             myform.addEventListener('submit', stop, false);

17             function stop(e) {

18                 var username = document.getElementById('username');

19                 var str = username.value;

20                 if (str === '') {

21                     //要求输入内容

22                     alert("请输入用户名");

23                 } else {

24                     alert("输入的值是：" + str);

25                 }

26             }

27         </script>

28     </body>

29 </html>

JavaScript 表单事件的更多相关文章

  1. javascript中的常用表单事件用法

    下面介绍几种javascript中常用的表单事件: 一,onsubmit:表单中的确认按钮被点击时发生的事件,如下案例. 案例解析:弹出表单中提交的内容 <form name="tes ...

  2. 前端（十五）—— JavaScript事件：绑定事件方式、事件的冒泡和默认事件、鼠标事件、键盘事件、表单 事件、文档事件、图片事件、页面事件

    JS事件:绑定事件方式.事件的冒泡和默认事件.鼠标事件.键盘事件.表单 事件.文档事件.图片事件.页面事件 一.事件的两种绑定方式 1.on事件绑定方式 document.onclick = func ...

  3. JavaScript表单处理（上）

    为了分担服务器处理表单的压力,JavaScript提供了一些解决方案,从而大大打破了处处依赖服务器的局面.  发文不易,转载请亲注明出处,谢谢! 一．表单介绍 在HTML中,表单是由<form& ...

  4. 第一百二十二节，JavaScript表单处理

    JavaScript表单处理 学习要点: 1.表单介绍 2.文本框脚本 3.选择框脚本 为了分担服务器处理表单的压力,JavaScript提供了一些解决方案,从而大大打破了处处依赖服务器的局面. 一． ...

  5. JavaScript表单验证和正则表达式

    JavaScript表单验证 分为四类: 1.非空验证 常用于用户名等 2.相等验证 常用于验证两次输入的密码 3.范围验证 常用于年龄等 4.正则验证 用于手机号,邮箱号等 以下是实例: <! ...

  6. JavaScript表单

    JavaScript表单 这篇文章的主要目的是介绍表单相关的知识,如表单基础知识.文本框脚本相关用法.选择框脚本相关用法以及等知识.虽然在现代web开发中,很少会使用form默认行为提交表单数据,而是 ...

  7. 15个最佳的 JavaScript 表单验证库

    客户端验证在任何项目都是不够的,因为 JavaScript 可以直接忽略,人们可以提交请求到服务器. 然而这并不意味着客户端验证都没必要了,很多时候我们需要在用户提交到服务器之前给予提示.JavaSc ...

  8. jQuery-3.事件篇---表单事件

    jQuery表单事件之blur与focus事件 在之前2.8与2.9节我们学过了表单处理事件focusin事件与focusout事件,同样用于处理表单焦点的事件还有blur与focus事件 它们之间的 ...

  9. JavaScript 表单验证 案例

    JavaScript 表单验证 案例 版权声明:未经授权,严禁转载!   编写 HTML 文件,搭建主体界面 <html> <head> <meta charset=&q ...

随机推荐

  1. [数据结构]一元n次多项式的抽象数据类型

    一.问题描述 一元n次多项式是代数学中经常出现的代数式,对于一元n次多项式的操作有很重要的实际意义.由于一个一元n次多项式最多有n+1项,且互不相关,所以可以用一个线性表来保存一个多项式,从前至后次数 ...

  2. 大家好 这里是yi术家

    好久没有来打卡了的说,可能你以为我忽然一时的热度刷题,但是事情并不是这样. 我在之前的章节里写到,我觉得每天的打卡有点浪费资源和时间,所以决定一周打一次卡. 可是上周好像也忘了打卡的样子. 这样任性的 ...

  3. C# Debug和Trace：输出调试信息

    在 C# 语言中允许在程序运行时输出程序的调试信息,类似于使用 Console.WriteLine 的方式向控制台输出信息.所谓调试信息是程序员在程序运行时需要获取的程序运行的过程,以便程序员更好地解 ...

  4. 反射、静态代理、动态代理（jdk、cglib）

    一.反射 反射在之前的文章中详细的解释过了,简单概括就是:可以动态的获取到一个类内部的所有的信息,动态的去创建对象和使用对象以及可以操作对象的属性和方法. 二.代理 首先解释一下代理:使用一个代理对象 ...

  5. Flask 自建扩展

    自建扩展介绍 Flask扩展分两类 纯功能, 如: Flask-Login 提供用户认证 对已有的库和工具包装(简化继承操作,并提供有用的功能,更方便) 如: Flask-SQLAlchemy 包装了 ...

  6. C# ProgressBar的简单使用

    ProgressBar控件(进度条)用于在win窗体中显示进度,由于它的值会不断更新,为了不让界面假死,一般都是采用多线程的方式对进度条进行管理.有关ProgressBar的理论基础跟详细知识我在这里 ...

  7. tp5用户id登录进行权限设置

    HTML代码:<!DOCTYPE html> <html lang="en"> <head> <meta charset="UT ...

  8. .Net6 设置环境变量

    开发过程中经常要发布一个版本到测试服上给测试人员测试,可能需要直接输出错误信息,需要设置环境变量为Development,如果是IIS可以通过设置IIS环境变量,见下面这篇文章 https://blo ...

  9. python 关于heapq模块的随笔

    heapq模块提供了很多高级功能可以通过help(heapq)查看详细文档: 要点: 1优先级队列让我们可以按照重要程度来处理元素,而不是先进先出 2使用heapq可以应对长列表,因为heap不是复杂 ...

  10. dotnet 委托的实现解析（2）开放委托和封闭委托 (Open Delegates vs. Closed Delegates)

    前言 这是个人对委托的理解系列第二篇,部分翻译自 Open Delegates vs. Closed Delegates – SLaks.Blog,好像还没人翻译过,加上部分个人理解.希望能对大家理解 ...