最近做项目,要用到AngularJs,之前也有用过一点点,但仅限于数据的绑定,这次项目要整个前端需要使用这个框架,可能是不熟悉的原因,感觉这代码搞起来非常的不便利,;现总结一个响应回车事件:

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>test</title> <script src="http://apps.bdimg.com/libs/angular.js/1.3.9/angular.min.js"></script>
<script>
var myApp = angular.module("myApp", []);
myApp.controller("testCtrl", function($scope){
$scope.myClass = 'red';
$scope.isClick = 'No!';
$scope.myKeyup = function(e){
var keycode = window.event?e.keyCode:e.which;
if(keycode==13){
$scope.myClass = 'green';
$scope.myClick();
}
};
$scope.myClick = function(){
$scope.isClick = 'Yes!';
};
});
</script>
<style>
.red {color:red}
.green {color:green}
</style>
</head> <body>
<div ng-app="myApp">
<div ng-controller="testCtrl">
<input ng-keyup="myKeyup($event)" type="text" />
<ul>
<li ng-click="myClick()" class="{{myClass}}">{{isClick}}</li>
</ul>
</div>
</div>
</body>
</html>

  

AngularJs 相应回车事件的更多相关文章

  1. angularjs中响应回车事件

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

  2. AngularJS HTML DOM& 事件

    AngularJS 为 HTML DOM 元素的属性提供了绑定应用数据的指令. ng-disabled 指令直接绑定应用程序数据到 HTML 的 disabled 属性 <div ng-app= ...

  3. jquery 回车事件

    简单地记下jquery实现回车事件,代码如下: 全局: $(document).keydown(function(e){ if(e.keyCode==13){ $(".login-li in ...

  4. jquery 键盘回车事件

    <input id="search" placeholder="输入要领用的资产条码" id="scanCode" type=&quo ...

  5. js-处理回车事件

    /**回车 */ function enterkey() { //兼容IE或其它其它浏览器 var event = arguments[0] || window.event; //兼容IE或其它浏览器 ...

  6. AngularJS 学习之事件

    1.ng-click指令:定义了AngularJS点击事件 <div ng-app="" ng-controller="myCtrl"> <b ...

  7. angularJS支持的事件

    AngularJS提供可与HTML控件相关联的多个事件.例如ng-click通常与按钮相关联.以下是AngularJS支持的事件. ng-click ng-dbl-click ng-mousedown ...

  8. angularjs的touch事件

    angularJs没有touch事件.这里提供一个touch指令. ngTouch.js "use strict"; angular.module("ngTouch&qu ...

  9. js 监听整个页面的回车事件

    JS监听整个页面的回车事件 <script type="text/javascript"> document.onkeydown=keyDownSearch;      ...

随机推荐

  1. [译]GLUT教程 - 整合代码5

    Lighthouse3d.com >> GLUT Tutorial >> Extras >> The Code So Far V 该代码与位图字体的代码类似.区别是 ...

  2. Pentaho 免费版本下载地址列表

    Pentaho CE(Community Edition) 免费版本下载地址列表 http://sourceforge.net/projects/pentaho/files/Pentaho 插件名称  ...

  3. 【数据挖掘】聚类之k-means(转载)

    [数据挖掘]聚类之k-means 1.算法简述 分类是指分类器(classifier)根据已标注类别的训练集,通过训练可以对未知类别的样本进行分类.分类被称为监督学习(supervised learn ...

  4. centos 6.9 编译安装 Nginx1.12.1

    centos 6.9 使用yum 安装 Nginx1.12.1 Nginx (engine x) 是一个高性能的HTTP和反向代理服务器,也是一个IMAP/POP3/SMTP服务器.Nginx是由伊戈 ...

  5. 嵌入式数据库H2的安装与配置

    一.配置JAVA环境 1.首先检查系统是否自带JDK 使用命令:#java -version 没有信息即为没有安装,如有且版本较低,可采用如下方式卸载: 查看命令: rpm -qa | grep ja ...

  6. C语言基础知识【判断】

    C 判断1.判断结构要求程序员指定一个或多个要评估或测试的条件,以及条件为真时要执行的语句(必需的)和条件为假时要执行的语句(可选的).C 语言把任何非零和非空的值假定为 true,把零或 null ...

  7. webview300毫秒点击问题

    http://www.jshacker.com/note/3585 http://blog.csdn.net/zfy865628361/article/details/49512095 http:// ...

  8. 【BZOJ1007】[HNOI2008]水平可见直线 半平面交

    [BZOJ1007][HNOI2008]水平可见直线 Description 在xoy直角坐标平面上有n条直线L1,L2,...Ln,若在y值为正无穷大处往下看,能见到Li的某个子线段,则称Li为可见 ...

  9. STM32 ~ J-LINK V8 修复

    1.1    安装固件烧录软件 ♦请ATMEL官方网址下载AT91-ISP下载软件. 软件下载地址:http://www.atmel.com/dyn/products/tools_card.asp?t ...

  10. 网页中显示xml,直接显示xml格式的文件

    第一种方法 使用<pre></pre>包围代码(在浏览器中测试不行啊,但是在富编辑器中又可以,怪):使用<xmp></xmp>包围代码(官方不推荐,但是 ...