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

实例：

 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. 推荐一款好用的国产web报表软件，轻松搞定复杂报表

    随着经济全球化程度的逐步加深以及全球市场的加速整合以便最大程度地对企业资源进行整合,从而达到降低成本和提高效率的目的.Web报表由于借助于web平台,即运用了B/S模式,即"浏览器/服务器& ...

  2. nodejs调用jar

    目前nodejs调用jar主要有两种方式: 通过创建子进程运行java -jar命令调用包含main方法的jar 使用node-java通过c++桥接调用jar 方法一(子进程运行): const { ...

  3. ibv_get_device_list()函数

    struct ibv_device** ibv_get_device_list(int *num_devices); 描述 函数用来返回一个当前可用的RDMA设备数组. 注意 数组以NULL结尾: R ...

  4. JZ-060-把二叉树打印成多行

    把二叉树打印成多行 题目描述 从上到下按层打印二叉树,同一层结点从左至右输出.每一层输出一行. 题目链接: 把二叉树打印成多行 代码 import java.util.ArrayList; impor ...

  5. DNS服务/etc/rndc.key was found解决办法

    问题: [root@localhost ~]# rndc reload rndc: neither /etc/rndc.conf nor /etc/rndc.key was found 解决办法: R ...

  6. 4、mysql的存储引擎

    存储引擎 存储引擎是负责对表中的数据进行提取和写入工作的,我们可以为不同的表设置不同的存储引擎,也就是说不同的表可以有不同的物理存储结构,不同的提取和写入方式. 1.1 InnoDB 引擎:具备外键支 ...

  7. 面向服务开发(SOA)

    面向服务的体系结构是一个组件模型,它将应用程序的不同功能单元(称为服务)通过这些服务之间定义良好的接口和契约联系起来.接口是采用中立的方式进行定义的,它应该独立于实现服务的硬件平台.操作系统和编程语言 ...

  8. OAuth2和JWT - 如何设计安全的API？

    JWT和OAuth2比较? 要比较JWT和OAuth2?首先要明白一点就是,这两个根本没有可比性,是两个完全不同的东西. JWT是一种认证协议        JWT提供了一种用于发布接入令牌(Acce ...

  9. IC设计学习路线

    一 前言 一直以来都是这也想学那也想学,搞个两三个月又放弃了,开始搞新的,从来没有任何东西超过一年,更不要说坚持三年.现在经历的事情多了,学过各种编程语言明白了要想学会一个专业技能,至少是三年.得到软 ...

  10. Python datetime获取当前年月日时分秒

    from datetime import datetime now_time = datetime.now() str_time = now_time.strftime("%Y-%m-%d ...