Meteor事件
让我们创建HTML模板三大要素。第一个是 p 标签，第二个是 myClass 类，最后一个是myId。
meteorApp/import/ui/meteorApp.html
<head>
<title>meteorApp</title>
</head> <body>
<div>
{{> myTemplate}}
</div>
</body> <template name = "myTemplate">
<p>PARAGRAPH...</p>
<button class = "myClass">CLASS</button>
<button id = "myId">ID</button>
</template>
在我们的JavaScript文件，正在为上面创建的三个要素对应的三个事件。可以看到，我们只是加入对 p，.myClass和#myId在click事件之后。这些都是我们上面提到的选择器。
client/main.js
if (Meteor.isClient) {
Template.myTemplate.events({
'click p': function(){
console.log("The PARAGRAPH is clicked...");
},
'click .myClass': function(){
console.log("The CLASS is clicked...");
},
'click #myId': function(){
console.log("The ID is clicked...");
},
});
}
为了验证这一点，我们可以先点击 PARAGRAPH, 然后点 CLASS 按键，最后点击 ID 按钮. 我们将得到下面的控制台日志。
您可以使用所有其他的JavaScript事件：click, dbclick, contextmenu, mousedown, mouseup, mouseover, mouseout, mousemove 按照上述的例子。
Meteor事件的更多相关文章
- 【译】Meteor 新手教程：在排行榜上添加新特性
原文:http://danneu.com/posts/6-meteor-tutorial-for-fellow-noobs-adding-features-to-the-leaderboard-dem ...
- JNI详解---从不懂到理解
转载:https://blog.csdn.net/hui12581/article/details/44832651 Chap1:JNI完全手册... 3 Chap2:JNI-百度百科... 11 C ...
- Meteor全栈开发平台 - 不仅仅是前端
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博客地址为http://www.cnblogs.com/jasonnode/ .网站上有对应每一 ...
- 怎么评价Facebook的Relay框架？Meteor.js 是什么？
http://www.zhihu.com/question/34531232?rf=34500201 Meteor.js 是什么? 作者:陈天链接:http://www.zhihu.com/quest ...
- 【转换模型+扫描线】【UVA1398】Meteor
The famous Korean internet company nhn has provided an internet-based photo service which allows The ...
- Meteor全栈开发平台
Meteor全栈开发平台 本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,博客地址为http://www.cnblogs.com/jasonno ...
- Meteor入门
转载Meteor入门介绍 Meteor是什么 基于nodejs的实时web APP开发框架. Meteor能带来什么 简单的说,你可以用js搞定客户端.服务端的开发.另外,客户端.服务端的界限被极 ...
- Meteor入门介绍
Meteor是什么 基于nodejs的实时web APP开发框架. Meteor能带来什么 简单的说,你可以用js搞定客户端.服务端的开发.另外,客户端.服务端的界限被极大的模糊.客户端的界面跟服务端 ...
- Meteor.js异步全解
翻译来源: http://phucnguyen.info/blog/everything-you-need-to-know-about-async-meteor/ posted in Web Deve ...
随机推荐
- 下拉列表事件 Dropdown iview
<Dropdown @on-click="export"> <Button icon='md-log-out'> 000l <Icon type=&q ...
- 这就是那个feature map256 256向量
http://blog.csdn.net/XZZPPP/article/details/51582810 在这个特征图上使用3*3的卷积核(滑动窗口)与特征图进行卷积,那么这个3*3的区域卷积后可以获 ...
- 【vc】高精度时间函数的使用
方法一: 函数定义如下: int UsSleep(int us);//返回实际的微秒延时时间 代码实现如下: //参数一表示 需要等待的时间 微秒为单位 int UsSleep(int us) { / ...
- 筛选法 || POJ 3292 Semi-prime H-numbers
5,9,13,……叫H-prime 一个数能且仅能由两个H-prime相乘得到,则为H-semi-prime 问1-n中的H-semi-prime有多少个 *解法:vis初始化为0代表H-prime, ...
- docker guide
centos docker community version install: yum -y install docker # install docker systemctl start dock ...
- 面试奇遇 -- 原生JS
最近几日去参加一些面试,多多少少有一些收获. 现将遇到的一些面试题,做一下分析和总结. 1.使用原生JS,不能使用递归,查找dom中所有以“<com-”开头的自定义标签tagName. < ...
- MySQL存储过程实践
对employees数据库建立存储过程 创建不含有输入输出变量的存储过程 DELIMITER // -- 设定语句结束分隔符 DROP PROCEDURE IF EXISTS GetEmployees ...
- docker快速搭建
curl -sSL https://get.docker.com|sh docker --version systemctl start docker.service ps -ef|grep doc ...
- Cookie 详解以及实现一个 cookie 操作库
Cookie 详解以及实现一个 cookie 操作库 cookie 在前端有着大量的应用,但有时我们对它还是一知半解.下面来看看它的一些具体的用法 Set-Cookie 服务器通过设置响应头来设置客户 ...
- Mac下复制粘贴的快捷键是什么？随记
刚从window换成Mac OS系统的用户对于一些常用的快捷键一定非常的不习惯,“mac复制粘贴快捷键是什么?”这一简单的问题相信很多刚刚从Windows平台转到Mac平台的用户会问到的问题,因为Ma ...