<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 双工绑定以及一个按钮多个事件的更多相关文章

  1. jquery移动端一个按钮两个事件

    当一个按钮已经有一个事件,如点击,弹窗显示,若还要加个事件,可以用touchstart 如: var videoCover = $("#videoCover");//视频封面 $( ...

  2. C# 调用一个按钮的Click事件（利用反射）

    最基本的调用方法 (1)button1.PerformClick();(2)button1_Click(null,null);(3)button_Click(null,new EventArgs()) ...

  3. ASP。net中如何在一个按钮click事件中调用另一个按钮的click事件

    方法一: 直接指定 事件<asp:Button ID="btn1" runat="server" Text="按钮1" onclick ...

  4. 利用反射--调用一个按钮的Click事件

    最基本的调用方法 (1)button1.PerformClick();(2)button1_Click(null,null);(3)button_Click(null,new EventArgs()) ...

  5. Javascript(jQuery)中绑定页面上所有按钮点击事件的几种方式

    方法一:使用document对象查找所有的按钮 [javascript] view plain copy 在CODE上查看代码片派生到我的代码片 //按照dom的方式添加事件处理 function B ...

  6. WPF中一个控件绑定另一个控件的属性

    如同一个Grid中的一个按钮根据另一个按钮的显示与否作出不同的响应: 绑定的时候通过ElementName来指定控件 <Grid Margin="50,130"> &l ...

  7. Qt-第一个QML程序-3-自定义一个按钮

    项目基本信息前两个已经说了,这里直接放下运行截图, 对的,这里就是说上面的那个红色的按钮,这里需要了解Qml的动画和状态 这里先把整个按钮的代码写出来,一点一点写 Rectangle { id:clo ...

  8. NGUI 按钮点击事件的两种绑定形式

    面板属性栏绑定 写一个脚本,定义一个Public的方法 Notify中选择物体时,选中自己 然后就可以选择通知到写的那个脚本的里边的public方法 代码绑定 创建一个代码文件,挂载到按钮对象上 代码 ...

  9. Android开发学习笔记--给一个按钮定义事件

    学习Android的第一天,了解了各种布局,然后自己动手画出了一个按钮,然后给按钮定义了一个事件是弹出一条消息显示“我成功了!”字样,具体过程如下: 1.修改布局文件activity_main.xml ...

随机推荐

  1. 洛谷P4015 运输问题(费用流)

    题目描述 WW 公司有 mm 个仓库和 nn 个零售商店.第 ii 个仓库有 a_iai​ 个单位的货物:第 jj 个零售商店需要 b_jbj​ 个单位的货物. 货物供需平衡,即\sum\limits ...

  2. 动画view

    1:view动画 @1:xml中 alph:渐变透明度动画效果 scale:渐变尺寸伸缩动画效果 translate:画面转换位置移动动画效果 rootate:画面转移旋转动画效果 @2:JavaCo ...

  3. 【原创】java的反射机制

    什么是java的反射?java在运行期间可以动态的加载.解析和使用一些在编译阶段并不确定的类型,这一机制被称作反射.它可以加载只有运行时才能确定的数据类型,解析类的内部结构,获取其基本信息,如方法.属 ...

  4. CentOS 7 安装配置MySQL

    环境 CentOS Linux release 7.5.1804 (Core) MySQL:mysql80-community-release-el7-1 检查: 在centos7中默认的是maria ...

  5. reduce & fold in Spark

    fold and reduce both aggregate over a collection by implementing an operation you specify, the major ...

  6. 8、Situation-Dependent Combination of Long-Term and Session-Based Preferences in Group Recommendations: An Experimental Analysis ----组推荐中基于长期和会话偏好的情景依赖组合

    一.摘要: 背景:会话组推荐系统的一个主要挑战是如何适当地利用群组成员之间的交互引起用户偏好,这可能会偏离用户的长期偏好.长期偏好和群组诱导的偏好之间的相对重要性应该根据具体的群组设置而变化. 本文: ...

  7. Flask-RESTful(转载)

    Flask-RESTful 是一个 Flask 扩展,它添加了快速构建 REST APIs 的支持.它当然也是一个能够跟你现有的ORM/库协同工作的轻量级的扩展.Flask-RESTful 鼓励以最小 ...

  8. debian 9 安装Virtual Box

    1.去官网下载deb包,例如包名: virtualbox-.2_5.2.18-124319_Debian_stretch_amd64.deb 2.安装 .2_5.2.18-124319_Debian_ ...

  9. elementUI 日期时间选择器el-date-picker开始时间与结束时间约束

    主要思路:el-date-picker组件需要 :picker-options属性,属性值为data,data的数据来自于methods中的方法. ##template代码 <el-form-i ...

  10. JavaScript div 上下运动实例

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...