输入框变成空之后，我还想鼠标 focus，应该怎么做？-慕课网

首页课程实战体系课手记专栏慕课教程

输入框变成空之后，我还想鼠标 focus，应该怎么做？

来源：3-1 todolist功能开发

八才斗

2018-05-28 16:15

输入框变成空之后，我还想鼠标 focus，应该怎么做？

写回答关注

2回答

jason6p: 2018-08-21 22:25:16

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
 content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
</head>
<body>
<div id="root">
    <div>
        <input v-model="inputValue" :autofocus="is_focus"/>
        <button @click="handleClick">提交</button>
    </div>
    <ul>
        <li v-for="item of list" :key="item">{{item}}</li>
    </ul>
</div>

<script>
    new Vue({
        el: '#root',
 data: {
            list: ['a', 'b', 'c'],
 inputValue: '',
 is_focus: '',
 },
 methods: {
            handleClick: function () {
                this.list.push(this.inputValue);
                this.inputValue = '';
                this.is_focus = true;
            }
        }
    })
</script>

</body>
</html>

1 0

盖茨苏

同求解~~

2018-09-25 12:20:17

共 1 条回复 >

janbs

2018-05-28 23:57:11

应该是可以用到html5的新特性 autofocus 然后也通过双向绑定的方法在执行清空value值的同时使autofocus为true

1 0

jason6...

大兄弟，我用autofocus为什么不行呀，我的代码在下面，帮我看看

2018-08-21 22:26:23

共 1 条回复 >

vue2.5入门

快速理解Vue编程理念上手Vue2.0开发。

147399 学习 · 675 问题

查看课程

相似问题

输入框清空之后，光标如何再次自动聚焦到输入框？

回答 2

老师如果我想更换端口8080应该怎么做呢

回答 1

v-bind：title="title"绑定之后，鼠标放上去没有反应

回答 1

输入框下面显示{firstName}{lastName}是怎么回事？

回答 2

如何去判断输入框中是空格，是空格得话，不进行li显示。

回答 6

打开慕课网App查看更多内容