您好,欢迎来到[编程问答]网站首页   源码下载   电子书籍   软件下载   专题
当前位置:首页 >> 编程问答 >> Web开发 >> (vue.js)请教下vue的input获得焦点事件

(vue.js)请教下vue的input获得焦点事件

来源:网络整理     时间:2017/12/2 0:53:18     关键词:

关于网友提出的“ (vue.js)请教下vue的input获得焦点事件”问题疑问,本网通过在网上对“ (vue.js)请教下vue的input获得焦点事件”有关的相关答案进行了整理,供用户进行参考,详细问题解答如下:

问题: (vue.js)请教下vue的input获得焦点事件
描述:

目前我想做一个登录框,在登录框上有一个图片,如果username的input获得了焦点,就显示图1,如果password获得了焦点,就显示图2,请问应该怎么写才对?
一开始我是这样写的:

<img :src='imgurl'>

在input上面写了@focus='test'
然后再methods下面写了个test事件
更改不了imgurl


解决方案1:

<img :src="show" alt=" (vue.js)请教下vue的input获得焦点事件">
<input type="text" @focus="handleinput()">

methods:{
    handleinput(){
            this.show=""
        },
}

解决方案2:

获取焦点是@focus 失去焦点是@blur

解决方案3:

能改呀,不知道你怎么写的,是苹果浏览器的话貌似要把focus换成click,还是用click吧

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" c c @focus="aaa()" /> 
       <input type="password" @focus="bbb()"/>
       <img :src="url"/>
    </div>
   <script src="https://cdn.jsdelivr.net/npm/vue"></script>
    <script>

           var vm = new  Vue({
            el:"#box",
            data:{
               url:"http://www.xuxin123.com/code/waterfall/images/33.jpg"
             },
             methods:{
                 aaa:function(){
                     this.url="http://www.xuxin123.com/code/waterfall/images/33.jpg";
                 },
                 bbb:function(){
                     this.url="http://www.xuxin123.com/code/waterfall/images/32.jpg";
                 }
             },
             mounted () {
              
            }
    
            
        });
    </script>
</body>
</html>

解决方案4:

是否在 focus 事件中 更改的时候 图片的src没有转换
最好把你的代码贴上来一下


以上介绍了“ (vue.js)请教下vue的input获得焦点事件”的问题解答,希望对有需要的网友有所帮助。
本文网址链接:http://www.codes51.com/itwd/4513400.html

相关图片

相关文章