首先,允许我这么称呼它们两个为兄弟。之所以这么称呼,是因为它们之间执行的是相同的任务----- 点击按钮。

然而,它们也有不同之处,次不同之处又使得它们貌似有些调用的意思。

接下来,让我来给大家说一下二者的关系,我们不妨举个例子来说明:

请看如下代码:

<div class="content_login"><input name="username" type="text" id="username" /><input name="password" type="password" id="password"οnkeydοwn='if(event.keyCode==13){loginbutton.click()}' /><div class="login_minu" id="loginbutton" οnclick="authen()"></div>
</div>

此代码为登录界面,两个输入框:一个为输入名字,另一个为输入密码。一个button ,id为loginbutton。至于这个button是什么样,我们暂时不用管,只知道他在类login_minu中定义就行。

要想实现回车或点击进入,那肯定是输入完后的事情,因此我在输入完密码后进行回车或点击事件。这就用到了click()和onclick()函数。这里我们用到了event.keyCode==13,此为javascript中的件键盘按回车键的code值(参考:http://www.okajax.com/a/200811/1124R022008.html)。它所表示的就是在键盘上按回车,html中按下键盘事件onkeydown,这里我们多说点html事件属性(以下来源于w3school)

窗口事件 (Window Events)

仅在 body 和 frameset 元素中有效。

属性 描述
onload 脚本 当文档被载入时执行脚本
onunload 脚本 当文档被卸下时执行脚本

表单元素事件 (Form Element Events)

仅在表单元素中有效。

属性 描述
onchange 脚本 当元素改变时执行脚本
onsubmit 脚本 当表单被提交时执行脚本
onreset 脚本 当表单被重置时执行脚本
onselect 脚本 当元素被选取时执行脚本
onblur 脚本 当元素失去焦点时执行脚本
onfocus 脚本 当元素获得焦点时执行脚本

图像事件 (Image Events)

该属性可用于 img 元素:

属性 描述
onabort 脚本 当图像加载中断时执行脚本

键盘事件 (Keyboard Events)

在下列元素中无效:base、bdo、br、frame、frameset、head、html、iframe、meta、param、script、style 以及 title 元素。

属性 描述
onkeydown 脚本 当键盘被按下时执行脚本
onkeypress 脚本 当键盘被按下后又松开时执行脚本
onkeyup 脚本 当键盘被松开时执行脚本

鼠标事件 (Mouse Events)

在下列元素中无效:base、bdo、br、frame、frameset、head、html、iframe、meta、param、script、style 以及 title 元素。

属性 描述
onclick 脚本 当鼠标被单击时执行脚本
ondblclick 脚本 当鼠标被双击时执行脚本
onmousedown 脚本 当鼠标按钮被按下时执行脚本
onmousemove 脚本 当鼠标指针移动时执行脚本
onmouseout 脚本 当鼠标指针移出某元素时执行脚本
onmouseover 脚本 当鼠标指针悬停于某元素之上时执行脚本
onmouseup 脚本 当鼠标按钮被松开时执行脚本

click()函数其实就是模拟单击按下。用法是buttonid.click()。onclick则是单击按钮的事件了,此为方法,因此我们可以将单击事件赋值给它,这样我们就完成了回车或单击进入的效果。

希望以上见解对您有所帮助!!----Mr.Zhang

html中实现回车或点击进入-----Mr.Zhang相关推荐

  1. html增加点击进入,html中实现回车或点击进入-----Mr.Zhang

    首先,允许我这么称呼它们两个为兄弟.之所以这么称呼,是因为它们之间执行的是相同的任务----- 点击按钮. 然而,它们也有不同之处,次不同之处又使得它们貌似有些调用的意思. 接下来,让我来给大家说一下 ...

  2. angularjs中按回车事件_浅谈angularjs中响应回车事件

    下面这个示例在输入框键入回车键或者点击按钮时,将输入框的值置为"Hello World!":(黄色背景内容为响应回车事件涉及到的代码) angularjs-demo test va ...

  3. vue项目中的回车登录

    vue项目中的回车登录:(搭配element ui 的使用 如果是原生,@keyup.enter="login(form)"就可以了) 在密码框上加代码:v-model=" ...

  4. Word 如何删除页面中的回车符 / 段落标记

    笔记本电脑在使用 Word 时,发现页面中的回车符无法去除,即使已经点击了选项卡中的回车符按钮 解决方案 最终效果: 现在页面中的回车符是否显示可通过选项卡中的回车符按钮操控了

  5. word删除多余换行_批量删除Word中多余回车

    有时候我们从网页上复制一些文章到Word中时,往往会带有好多向下箭头的符号,这就是软回车符号(Word中软回车是同时按住shift+enter得来的), 这些软回车占用了Word很多的空间,那么如何才 ...

  6. 解决按钮点击后长按回车无限触发点击事件问题

    思路: 包一层 UI 库的 button,在里面监听 onkeydown 和 onkeyup,用 flag 阻止长按回车一直触发. 然后在项目全局重新注册 el-button 覆盖掉UI内的按钮组件. ...

  7. python使用textwrap包在已经生成的长字符串中嵌入回车符实战

    python使用textwrap包在已经生成的长字符串中嵌入回车符实战 目录 python使用textwrap包在已经生成的长字符串中嵌入回车符实战 # textwrap包在长字符串中嵌入回车符 #实 ...

  8. c++图形中如何判断鼠标点击在一条直线上_PS教程:十种抠图方法【上】

    今天的关键字是"抠图" 日常工作生活中大家可能经常会用到抠图的技能 方法很多 包括使用美图秀秀等 我之前也分享过比如利用ppt如何抠图 那么今天就来给大家介绍十种用ps抠图的方法: ...

  9. Openlayers中使用Overlay实现点击要素显示html内容弹窗并且动态更改弹窗内容

    场景 Openlayers中使用Overlay实现点击要素弹窗并且弹窗随之移动: Openlayers中使用Overlay实现点击要素弹窗并且弹窗随之移动_BADAO_LIUMANG_QIZHI的博客 ...

最新文章

  1. python读取浮点数与源文件不同
  2. 调用系统函数向进程发信号core
  3. sonar.exclusions 配置无效问题
  4. 使用 FieldMask 提高 C# gRpc 服务性能
  5. 如何有效解决C与C++的相互调用问题
  6. 小程序背景图满屏_竞赛答题小程序
  7. Solidity基础入门知识---函数的访问权限和可见性
  8. 关于绑定事件的一个疑惑
  9. Win10值得推荐的软件,提升效率和桌面美观
  10. ARM-Linux 交叉编译工具链安装
  11. DirectX修复工具 4.0 标准版
  12. 粪斗这杆大旗下,注定只是少部分人的盛宴
  13. analyze 命令
  14. 期权定价模型之Heston模型--参数校准与定价【附python代码】
  15. wakeup_in休眠唤醒
  16. CleanMyMacX4.11.3最新版mac电脑磁盘清理工具功能
  17. 【Kubernetes】Pod学习(五)从Pod到容器:Downward API
  18. 关于批量下载MODIS数据的坑
  19. Feign原理以及feign调优
  20. 虚拟机VMware Workstation安装使用教程

热门文章

  1. 2017.9.7 翻硬币 失败总结
  2. 2017.3.27 生成魔咒 思考记录(有史以来最不容易)
  3. 【英语学习】【Daily English】U15 Culture L04 When in Rome, do as the Romans Do
  4. 【英语学习】【WOTD】inexorable 释义/词源/示例
  5. 【英语学习】【WOTD】gibbous 释义/词源/示例
  6. okhttp请求php接口,安卓:okhttp请求,获取返回数据
  7. python省市区三级联动_Ajax实现省市区三级级联详解
  8. Keras-10 模型可视化
  9. watchOS更新后 Apple Watch 4心电图功能已开始支持欧洲用户
  10. UVA1437 String painter