点击回车实现按钮点击功能

点击回车实现按钮点击功能:
在实际应用中,可能有这样的需求,点击一个按钮可以执行一个功能,当点击回车的时候也可以实现此功能,也就是说点击回车的时候也触发的点击事件,下面就通过代码实例介绍一下如何实现此功能。
代码如下:

<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>蚂蚁部落</title>
<style type="text/css">
#thediv{
  width:100px;
  height:100px;
  background-color:red;
}
</style>
<script type="text/javascript" src="mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
$(function(){
  $("#bt").click(function(){
    $("#thediv").css("background-color","blue");
  })
  $(document).keydown(function(e){
    if (!e)
      e = window.event;
    if ((e.keyCode || e.which) == 13) {
      $("#bt").click();
    }
  })
});
</script>
</head>
<body>
<div id="thediv"></div>
<input type="button" id="bt" value="查看效果"/>
</body>
</html>

以上代码实现了我们的要求,点击按钮或者点击回车都可以将div的背景色设置为蓝色。
相关阅读:
1.click事件可以参阅jQuery的click事件一章节。
2.css()函数可以参阅jQuery的css()方法一章节。  
3.keydown事件可以参阅jQuery的keydown事件一章节。 
4.keyCode属性可以参阅javascript的keyCode属性一章节。
5.wihich属性可以参阅jQuery的event.which属性一章节。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=12399

更多内容可以参阅:http://www.softwhy.com/jquery/

时间: 2024-10-10 11:22:08

点击回车实现按钮点击功能的相关文章

【WebForm】编程点滴:由文本框回车触发按钮点击事件想到的

在WebFomr中我们常常会需要实现这样一个功能:文本框回车时触发触发其他按钮的click事件.在JS中我们常常这样做: <html xmlns="http://www.w3.org/1999/xhtml"> <head runat="server"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

免费统计微信复制//打开/咨询/下载/表单按钮点击统计工具-好多粉

今天要跟大家讲解的是好多粉新上线的自定义行为转化统计,相对于传统的复制统计功能,只能统计微信号是否被复制,而无法统计页面上其他的内容,比如无法统计用户是否点击了打开微信按钮?是否点击了咨询按钮?是否提交了表单信息?等等! 好多粉最新推出的自定义行为转化统计功能,可以统计页面上的所有按钮点击情况,不受位置限制,方便统计访客的所有点击行为,并且支持统计的网页标签类型不受限制,可以是按钮,文字,图片,表单提交等.系统已提供数十种统计类型,便于分析访客的行为和推广效果,使用非常简单,系统提供了多种统计方

robotium脚本封装为APK,实现脱离手机数据线,使用按钮点击控制用例运行的小功能

最近一直在完成一些robotium的小功能,用来更方便的完成一些小功能的测试,或者可以说用来娱乐吧,幸得群内大神思路指点,就此引申,终于把这个功能得以实现 ---------------将robotium脚本封装为APK,使用按钮控制用例运行覆盖程度,测试结果以简单的xml文件输入到手机SD卡目录下---------------------- 废话不多说,转正题: 一.首先明确一点,这篇文章,是在你所编写的robotium脚本运行无异常的前提下实施 二.阐明思路: 1.我们需要一个运行良好的,逻

(Unity)Unity实现类似于安卓原生项目的点击安卓返回按钮回到前一页的功能

本章博主和大家一起讨论下Unity怎么实现类似安卓原生项目,点击安卓返回按钮实现返回到前一个页面的功能. 1.定义一个泛型用于响应安卓的返回按钮 public static List<GameObject> list; public GameObject addPanel;                     //添加首页 2.在Start方法中将首页压入栈中 list = new List<GameObject>(5); //将页面压入堆栈中 list.Add(addPane

UI_如何实现点击图片之后放大,或缩放功能

如何实现"查看大图"功能. ** 点击"图片"按钮, 显示大图 需求分析: 问:&1.点击图片之后就放大图片的功能的步骤是什么? 1>创建一个和屏幕一样大小的半透明UIView, 用来遮盖整个界面 2>需要把“图片按钮”, 放置在coverView的前面 3>将图片按钮放大 4>将这些操作放在block动画当中. 问:&2.黑色半透明的背景图片是一个什么控件?点击灰色背景后需要做哪些操作? 解析:是一个按钮,因为需要监听点击事

新浪微博项目技术之一正在播放按钮点击

一.效果图: 实现功能:在"正在播放"按钮时,切换到下一个界面并继续原歌曲的播放进度 二.实现方法及步骤 1.思路: 第一步.点击按钮事件中再show到下一个界面的时候,推出到我们创建的那个单例视图(前面已将第二个界面视图创建为单例对象)中 第二步.在点击页面播放的时候,如果当前播放为第四首歌曲,show的也是第四首的话,就不需要从头播放,继续当前位置播放即可,如果是下一首的话则需要从头播放(想清楚这个逻辑判断关系) 2.步骤: 第一步实现步骤: @interface MusicLis

L--怎样让用户点击浏览器后退按钮刷新后退页面的验证码

介绍 项目需要,怎样让用户点击浏览器后退按钮刷新后退页面的验证码,通过cookie来解决 方法一(通过设置前台html)(失败) 本想通过控制html的http-equiv属性来解决问题,如下 http-equiv属性 1.<meta http-equiv="Content-Type" contect="text/html";charset=gb_2312-80"> 和 <meta http-equiv="Content-Lan

js触发按钮点击事件

js触发按钮点击事件 博客分类: javascript 模拟JS触发按钮点击功能 Html代码   <html> <head> <title>usually function</title> </head> <script> function load(){ //下面两种方法效果是一样的 document.getElementById("target").onclick(); document.getElement

Objective-C:模拟按钮点击事件理解代理模式

OC中的协议(Protocol)和和.NET中的接口(Interface)类似,简单来讲,就是一系列方法的列表,其中声明的方法可以被任何类实现.不同的是,在.NET中,如果某个类实现了一个接口,就必须实现这个接口中声明的所有方法:但在OC中,可以不实现协议中声明的所有方法,需要用到某些功能,就去实现对应的方法即可. 这种模式一般称为代理模式.在iOS和OS X开发中,Apple采用了大量的代理模式来实现MVC中View(UI控件)和Controller(控制器)的解耦. 监听思想:如果想让某个对