八、v-on绑定事件监听器

深碍√TFBOYSˉ_ 2022-05-03 02:58 149阅读 0赞

#                                   绑定事件监听器 #

v-on 就是监听事件，可以用v-on指令监听DOM事件来触发一些javascript代码。

<!DOCTYPE html>
    <html lang="en" xmlns:v-on="http://www.w3.org/1999/xhtml">
    <head>
        <meta charset="UTF-8">
        <title>v-on 实例</title>
        
        <script type="text/javascript" src="../assets/js/vue.js"></script>
    </head>
    <body>
        <h1>v-on实例</h1>
        <hr>
        <div id="app">
            本场比赛得分： {
       {count}}<br/>
            <button v-on:click="jiafen">加分</button>
            <button @click="jianfen">减分</button>
            <br>
            <hr/>
            v-model="secondCount":表示绑定input中的数据到secondCount这个变量
            <br>
            <input type="text" @keyup.enter="onEnter" v-model="secondCount">
        </div>
    
        <script type="text/javascript">
            var app=new Vue({
                el:'#app',
                data:{
                    count:1,
                    secondCount:1
                },
                methods:{//表示声明一些方法
                    jiafen:function(){//定义方法名
                        this.count++;
                    },
                    jianfen:function(){
                        this.count--;
                    },
                    onEnter:function(){
                        this.count=this.count+parseInt(this.secondCount);
                    }
                }
            })
        </script>
    </body>
    </html>

发表评论取消回复

表情：

评论列表（有 0 条评论，149人围观）

还没有评论，来说两句吧...

相关阅读

相关 php 事件绑定,php实现事件绑定

class EventHandle \{ private static $\_map = array(); //类似jquery绑定事件 public function

谁践踏了优雅/ 2022年11月12日 12:54/ 0 赞/ 313 阅读

相关 jquery绑定事件

bind()向匹配元素添加一个或多个事件处理器。 $(selector).bind(event,data,function) live() 向当前或未来的匹配元素添加一个

左手的ㄟ右手/ 2022年06月17日 01:27/ 0 赞/ 330 阅读

相关 select 绑定事件

select 它的事件是注册在自己标签上的，不是onclick，而是onchange，子标签对低版本浏览器无效，而且也不是正规标准的写法。

比眉伴天荒/ 2022年06月16日 06:48/ 0 赞/ 224 阅读

相关 JavaScript事件绑定

JavaScript事件绑定 -------------------- JavaScript也称ECMAScript，是一种动态类型、弱类型、基于原型的直译式脚本语言；

刺骨的言语ヽ痛彻心扉/ 2022年06月06日 02:15/ 0 赞/ 289 阅读

相关 vue 事件绑定

<!DOCTYPE html> <html> <head> <meta charset="utf-8" />

末蓝、/ 2022年05月31日 09:57/ 0 赞/ 302 阅读

相关 JQuery_绑定事件

绑定：绑定事件：一.如何给元素同时绑定两个事件？方法一：链式编程 $('button').click(function(){ a

ゞ浴缸里的玫瑰/ 2022年05月20日 23:42/ 0 赞/ 371 阅读

相关八、v-on绑定事件监听器

绑定事件监听器 v-on 就是监听事件，可以用v-on指令监听DOM事件来触发一些j

深碍√TFBOYSˉ_/ 2022年05月03日 02:58/ 0 赞/ 150 阅读

相关 Tkinter：事件绑定

正如我们此前提到的，一个 Tkinter 应用程序大部分时间花费在事件循环中（通过 mainloop() 方法进入）。事件可以有各种来源：包括用户触发的鼠标和键盘操作和窗口管理

朴灿烈づ我的快乐病毒、/ 2022年04月02日 15:44/ 0 赞/ 318 阅读

相关 Java使用自定义注解为事件源绑定事件监听器

一定义注解 import java.lang.annotation.; import java.awt.event.; @Target(E

待我称王封你为后i/ 2021年09月29日 13:50/ 0 赞/ 263 阅读

相关 WEUI 事件绑定

1、简易的输入同步框所需用到的事件为bindinput,详情可以查看开发文档通过bindinput事件来监听输入框的值是否发生改变且获取到改变后的值，之后在js文件...

小灰灰/ 2021年02月15日 17:29/ 0 赞/ 1046 阅读