vue事件

<body>
    <!-- blur:元素失去焦点时触发。这个事件不会冒泡;所有浏览器都支持
    focus:在元素获得焦点时触发。这个事件不会冒泡;所有浏览器都支持 -->
     
    <div id="app">
        <input type="text" placeholder="请输入内容" @focus="focus" v-bind:placeholder="placeholder" @blur="blur" @click="click" @dblclick="dblclick" @mousedown="mousedown" @keyup.enter="search" >
        <!-- 鼠标事件 -->
        <!-- <div class="box" :class="{'box-leave':isshow}">
        </div> -->
    </div>


    <script>
     new Vue({
        el:'#app',
       data:{
         placeholder:'请输入你的内容'
       },
       methods:{
       focus(){
        this.placeholder="获得焦点事件"
       },
       blur(){
        this.placeholder="失去焦点事件"
       },
    //    单击
       click(){
    //     console.log('需要单击才能成功');
       },
    //    双击
    dblclick(){
        // console.log('需要双击才会出来');
    },
    mousedown(){
        // console.log('任意点击鼠标键都可以出现');
    },
    search(){
        console.log('输入键盘事件');
    } 
    }
     })
    </script>
    <!-- <script>
      
    //     项目	                 Value
    //   click	        单击鼠标左键时发生,如果右键也按下则不会发生。当用户的焦点在按钮上并按了 Enter 键时,同样会触发这个事件
    //   dblclick	    双击鼠标左键时发生,如果右键也按下则不会发生
    //   mousedown	    单击任意一个鼠标按钮时发生
    //   mouseout	    鼠标指针位于某个元素上且将要移出元素的边界时发生
    //   mouseover	    鼠标指针移出某个元素到另一个元素上时发生
    //   mouseup	        松开任意一个鼠标按钮时发生
    //   mousemove	    鼠标在某个元素上时 持续 发生
    </script> -->

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值