avalon 双工绑定以及一个按钮多个事件
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="Content/js/jquery-1.11.1.min.js"></script>
<script src="Content/js/avalon.js"></script>
<script type="text/javascript">
var count = 0;
var model = avalon.define({
$id: "test",
name: "hello",
passwd: "world",
profile: "",
isSure: false,
fruit: "",
hobbies: [],
airLine: "",
hotel: [],
gender: "female",
isPay: false,
str1: "1",
str2: "2",
str3: "3",
click0: function () {
model.str1="xxxxxx"+(count++)
},
click1: function () {
model.str2 = "xxxxxx" + (count++)
},
click2: function () {
model.str3 = "xxxxxx" + (count++)
}
});
</script>
</head>
<body ms-controller="test">
<input ms-duplex="name" />
<input ms-duplex="passwd" /><br />
<ul>
<li>{{name}}</li>
<li>{{passwd}}</li>
<li>{{name+passwd+"!"}}</li>
</ul>
<br />
<input type="radio" ms-duplex="isSure" /><span>{{isSure}}</span><br />
<br />
<input type="radio" ms-duplex-value="fruit" value="苹果" name="fruit" />苹果
<input type="radio" ms-duplex-value="fruit" value="雪梨" name="fruit" />雪梨
<input type="radio" ms-duplex-value="fruit" value="香蕉" name="fruit" />香蕉
<span>{{fruit}}</span><br />
<br />
<input type="radio" value="female" ms-duplex-text="gender">女<br>
<input type="radio" value="male" ms-duplex-text="gender">男<br>
性别:{{gender}}<br/>
<br>
<input type="radio" ms-duplex-boolean="isPay" value="true">是<br>
<input type="radio" ms-duplex-boolean="isPay" value="false">否<br>
是否付款:{{isPay}}<br>
<br>
<br>
<input type="checkbox" ms-duplex="hobbies" value="PingPong" name="hobby">乒乓球<br>
<input type="checkbox" ms-duplex="hobbies" value="Bedminton" name="hobby">羽毛球<br>
<input type="checkbox" ms-duplex="hobbies" value="Basketball" name="hobby">篮球<br><br />
<span>{{hobbies}}</span>
<br />
<br />
<select ms-duplex="airLine">
<option value="beijing-guangzhou">北京-广州</option>
<option value="beijing-shenzhen">北京-深圳</option>
<option value="beijing-shanghai">北京-上海</option>
</select>
<span ms-text="airLine"></span>
<br>
<select ms-duplex="hotel" multiple="multiple">
<option value="广州白云商务酒店">广州白云商务酒店</option>
<option value="深圳红树湾酒店">深圳红树湾酒店</option>
<option value="上海7天假日酒店">上海7天假日酒店</option>
</select>
<span>{{hotel}}</span>
//一个按钮多个事件
<div ms-click="click0" ms-click-1="click1" ms-click-2="click2"><button>请点我</button></div>
<div>{{str1}}</div>
<div>{{str2}}</div>
<div>{{str3}}</div>
</body>
</html>
//一个按钮多个事件
单击第一次:
单击第二次(以此类推):
avalon 双工绑定以及一个按钮多个事件的更多相关文章
- jquery移动端一个按钮两个事件
当一个按钮已经有一个事件,如点击,弹窗显示,若还要加个事件,可以用touchstart 如: var videoCover = $("#videoCover");//视频封面 $( ...
- C# 调用一个按钮的Click事件(利用反射)
最基本的调用方法 (1)button1.PerformClick();(2)button1_Click(null,null);(3)button_Click(null,new EventArgs()) ...
- ASP。net中如何在一个按钮click事件中调用另一个按钮的click事件
方法一: 直接指定 事件<asp:Button ID="btn1" runat="server" Text="按钮1" onclick ...
- 利用反射--调用一个按钮的Click事件
最基本的调用方法 (1)button1.PerformClick();(2)button1_Click(null,null);(3)button_Click(null,new EventArgs()) ...
- Javascript(jQuery)中绑定页面上所有按钮点击事件的几种方式
方法一:使用document对象查找所有的按钮 [javascript] view plain copy 在CODE上查看代码片派生到我的代码片 //按照dom的方式添加事件处理 function B ...
- WPF中一个控件绑定另一个控件的属性
如同一个Grid中的一个按钮根据另一个按钮的显示与否作出不同的响应: 绑定的时候通过ElementName来指定控件 <Grid Margin="50,130"> &l ...
- Qt-第一个QML程序-3-自定义一个按钮
项目基本信息前两个已经说了,这里直接放下运行截图, 对的,这里就是说上面的那个红色的按钮,这里需要了解Qml的动画和状态 这里先把整个按钮的代码写出来,一点一点写 Rectangle { id:clo ...
- NGUI 按钮点击事件的两种绑定形式
面板属性栏绑定 写一个脚本,定义一个Public的方法 Notify中选择物体时,选中自己 然后就可以选择通知到写的那个脚本的里边的public方法 代码绑定 创建一个代码文件,挂载到按钮对象上 代码 ...
- Android开发学习笔记--给一个按钮定义事件
学习Android的第一天,了解了各种布局,然后自己动手画出了一个按钮,然后给按钮定义了一个事件是弹出一条消息显示“我成功了!”字样,具体过程如下: 1.修改布局文件activity_main.xml ...
随机推荐
- Oracle 复合索引设计原理——前缀性和可选性
前缀性: 复合索引的前缀性是指只有当复合索引的第一个字段出现在SQL语句的谓词条件中时,该索引才会被用到.如复合索引为(ename,job,mgr),只要谓词条件中出现第一个字段ename,就可以用复 ...
- Ztree自动触发第一个节点的点击事件
1.代码 $(function () { var setting = { //check属性放在data属性之后,复选框不起作用 //check: { // enable: true //}, dat ...
- (转)Django学习之 第四章:Django模板系统
前面的章节我们看到如何在视图中返回HTML,但是HTML是硬编码在Python代码中的 这会导致几个问题: 1.显然,任何页面的改动会牵扯到Python代码的改动 网站的设计改动会比Python代码改 ...
- javascript: 基于原型的面向对象编程
Douglas Crockford指出javascript是世界上最被误解的编程语言.由于javascript缺少常见的面向对象概念,许多程序猿认为javascript不是一个合适的语言.我在做第一个 ...
- MAC 下的pycharm部分使用方法
1.在创建之初,可以选择自己想要使用的python版本. 如果之后想要更换Python版本,可以通过~~~更换选择Python版本. 2.创建.py文件,点击文件名,出现如下界面: 点击new--py ...
- 浏览器渲染HTML页面步骤
渲染步骤:浏览器渲染页面时,表示网站资源已经请求成功(要了解查看:浏览器向服务器请求资源过程) 解析HTML以构建dom树--->构建render树--->布局render树---> ...
- Java 面向对象详解
0 引言 接触项目开发也有很长一段时间了,最近开始萌发出想回过头来写写以前学过的基础知识的想法. 1 面向对象 面向对象(Object Oriented)是一种新兴的程序设计方法,或者是一种新的程序设 ...
- 一些BFC
我们可能会遇到这样的一些问题,比如:子元素浮动,父元素高度塌陷:父元素跟随子元素一起移动等 这是我们可以通过触发BFC来解决这样的问题. BFC为"块级格式化上下文".它是一个独立 ...
- POJ 3122 Pie( 二分搜索 )
链接:传送门 题意:一个小朋友开生日派对邀请了 F 个朋友,排队上有 N 个 底面半径为 ri ,高度为 1 的派,这 F 个朋友非常不友好,非得"平分"这些派,每个人都不想拿到若 ...
- java SSM多操作注解回滚
在业务操作时难免会遇到一个业务多操作,会用到事物回滚这里写了一个简单的多操作失败事物回滚案例 在这之前你需要在你的applicationContext-mybatis.xml中配置: <!-- ...