<!DOCTYPE html>

<html>

 <head>

    <meta charset="utf-8">

    <title>JS实现按下按键触发点击事件</title>

</head>

 <body>

      <h3>按下 Enter 触发按钮点击事件</h3>

      <p>选中输入框，然后按下"Enter" 就会触发按钮的点击事件。</p>

      <div>

         <input placeholder="输入一些文本" type="text">

         <button type="button" onclick="javascript:alert('点击了我或者按下了enter,对不对')">点击我

或者按下enter键</button>

      </div>

      <script>

             var input=document.getElementsByTagName("input");

             //给input注册按钮事件，用addEventListenner(注意兼容问题）

             input.addEventListener("keyup",function(event) {

            //要阻止默认事件

            event.preventDefault();

            //我要的是enter件，也就是enter事件，所以要判断是哪个事件

           if(event.keyCode===13){

                 document.getElementsByTagName("button").click();

     }

     })

     </script>

<body>

</html>






 


												


											
JS实现按下按键触发点击事件的更多相关文章
	

    
								
  1. 为啥使用Iscroll.js之后，a不能触发点击事件？
		
    原因:是iscroll.js阻止了a的行为. 解决方法:打开iscroll-probe.js,然后找到preventDefaultException方法. 然后修改为: // preventDefau ...
    
		
    2. 
						
  2. vue中Enter触发登录事件和javascript中Enter触发点击事件
		
    created(){ window.addEventListener('keydown', this.handleKeyDown, true)//开启监听键盘按下事件 } 在methods中当keyC ...
    
		
    3. 
						
  3. 解决jQuery ajax动态新增节点无法触发点击事件的问题
		
    在写ajax加载数据的时候发现,后面添加进来的demo节点元素,失去了之前的点击事件.为什么点击事件失效,我们该怎么去解决呢? 其实最简单的方法就是直接在标签中写onclick="" ...
    
		
    4. 
						
  4. 解决JavaScript拖动时同时触发点击事件的BUG
		
    在做在线地图项目的时候,在给marker点绑定事件时,因为有点击事件click,同时又存在拖动dragEnd事件,首先没有重大缺陷,就是在用户在点击的时候,有时候本想是点击,但是他触发了drag的事件 ...
    
		
    5. 
						
  5. 关于AJAX异步加载节点无法触发点击事件问题的解决方式
		
    做练习的过程中遇到一个问题,使用AJAX异步新增一个节点,无法触发点击事件,经过查阅之后知道一个方式,使用JS的委托事件,在此做一个记录. $(document).on('click', '.recr ...
    
		
    6. 
						
  6. view.performClick()触发点击事件
		
    1.主要作用 自动触发控件的点击事件 2.界面的布局文件  activity_main.xml <RelativeLayout xmlns:android="http://schema ...
    
		
    7. 
						
  7. 可以触发点击事件并变色的UILabel
		
    可以触发点击事件并变色的UILabel 谁说UILabel不能够当做button处理点击事件呢?今天,笔者就像大家提供一个改造过的,能够触发点击事件并变色的UILabel:) 效果图: 还能当做计时器 ...
    
		
    8. 
						
  8. (转载)js(jquery)的on绑定点击事件执行两次的解决办法
		
    js(jquery)的on绑定点击事件执行两次的解决办法—不是事件绑定而是事件冒泡 遇到的问题:jquery中用.on()给页面中新加的元素添加点击事件时,点击事件源,绑定的事件执行两次,这里的ale ...
    
		
    9. 
						
  9. Echarts如何添加鼠标点击事件？防止重复触发点击事件
		
    Echarts如何添加鼠标点击事件? 1.通常我们只使用了以下代码,通过配置项和数据显示图表. var myChart = echarts.init(document.getElementById(' ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. Android布局之RelativeLayout
			
    RelativeLayout用到的一些重要的属性: 第一类:属性值为true或falseandroid:layout_centerHrizontal 水平居中android:layout_center ...
    
			
    2. 
						
  2. 洛谷——P1518 两只塔姆沃斯牛 The Tamworth Two
			
    https://www.luogu.org/problem/show?pid=1518 题目背景 题目描述 两只牛逃跑到了森林里.农夫John开始用他的专家技术追捕这两头牛.你的任务是模拟他们的行为( ...
    
			
    3. 
						
  3. 使用Spring Mvc 转发 带着模板 父页面 之解决方法 decorators.xml
			
    周末了,周一布置的任务还没完毕,卡在了页面跳转上,接手了一个半截的项目要进行开发,之前没有人给培训.全靠自己爬代码,所以进度比較慢.并且加上之前没实用过 Spring Mvc 开发项目.所以有点吃力, ...
    
			
    4. 
						
  4. AutoLayout具体解释+手把手实战
			
    首先说一下这篇博客尽管是标记为原创,可是事实并不是本人亲自写出来的.知识点和样例本人花了一天各处查找和整理终于决定写一个汇总的具体解释,解去各位朋友到处盲目查找的必要,由于不是转载某一个人的内容.故此 ...
    
			
    5. 
						
  5. 转：IOS推送代码
			
    实例:调用方法:- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary ...
    
			
    6. 
						
  6. [转]Massive Model Rendering Techniques
			
    Massive Model Rendering Techniques Andreas Dietrich Enrico Gobbetti Sung-Eui Yoon Abstract We presen ...
    
			
    7. 
						
  7. vim 技巧之用宏命令批量处理文件
			
    今天遇到了一种情况,就是我需要同时修改34个文件中的某些字符串的内容,如果一个个打开需改的话,那也太麻烦了.后来就想着能不能通过vim的宏命令来修改呢?现在就总结下关于宏在文件列表中的应用1.首先,我 ...
    
			
    8. 
						
  8. LightOJ 1291 Real Life Traffic
			
    Real Life Traffic Time Limit: 2000ms Memory Limit: 32768KB This problem will be judged on LightOJ. O ...
    
			
    9. 
						
  9. Android实战简易教程-第二十五枪（基于Baas的数据表查询下拉刷新和上拉载入实现！）
			
    上一节我们实现了数据表的载入,可是,当数据表数据非常多时.我们就要考虑数据的分页.这里我们选用了PullToRefreshListView控件,先看一下该控件的说明: 效果图:             ...
    
			
    10. 
						
  10. ubuntu14.04 printk()默认打印的位置
			
    tail /var/log/syslog 即可显示printk打印的信息
    
			
    11.