页面一刷新让文本框自动获取焦点-- 和自定义v-focus指令
<body>
<div id="app">
<input type="text" value="" id="search">
</div>
<script>
var vm = new Vue({
el: "#app",
data: {
}
});
// 原生自动获取焦点
document.getElementById("search").focus();
</script>
</body>
这种方式 虽然可以实现 但是vue不提倡我们dom操作
所以我们自己写一个v-focus的指令 请看下面
自定义v-focus 页面一刷新就获取文本
bind inserted 这两个函数只会执行一次哦,
数据发生改变的时候,updated可能会执行多次哦。
bind:每当指令绑定到元素上的时候,就会立刻执行bind这个函数,
在这三个函数中,第一个参数永远是el,表示被绑定了指令的那个元素,这个el是一个原生的js对象。 inserted:表示元素插入到DOM中的时候,会执行inserted函数。
updated:当数据跟新的时候,就会执行updated,可能会触发多次
ps==>但是在element-ui中,你这种你要使用原生的哪一种方式
你使用自定义指令会失去效果 因为el-input是div哦,而不是input
<body>
<div id="app">
<input type="text" value="" v-focus>
</div>
<script>
Vue.directive("focus", {
bind: function (el) { },
inserted: function (el) {
el.focus();
},
updated(el) {
//当v-model跟新的时候,就会执行这个函数 这个函数会执行多次
},
}) var vm = new Vue({
el: "#app",
data: { }
});
</script>
</body>
页面一刷新让文本框自动获取焦点-- 和自定义v-focus指令的更多相关文章
- Vue系列之 => 自定义全局指定让文本框自动获取焦点
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- ASP.NET中页面加载时文本框(texbox控件)内有文字获得焦点时文字消失
代码如下: <asp:TextBox ID="TextBox1" runat="server" Height="26px" MaxLe ...
- Creating Dialogbased Windows Application (4) / 创建基于对话框的Windows应用程序(四)Edit Control、Combo Box的应用、Unicode转ANSI、Open File Dialog、文件读取、可变参数、文本框自动滚动 / VC++, Windows
创建基于对话框的Windows应用程序(四)—— Edit Control.Combo Box的应用.Unicode转ANSI.Open File Dialog.文件读取.可变参数.自动滚动 之前的介 ...
- 关于不使用web服务实现文本框自动完成扩展
来博客园很久了,一直是伸手党,呵呵,现在终于申请了一个账号并开通了博客 下面分享下之前在一个项目里遇到的问题 前段时间在一个项目里要求在文本框内输入要搜索的内容,自动提示与此内容相关的词条 当时在博客 ...
- ASP.NET输入文本框自动提示功能
在ASP.NET Web开发中会经常用到自动提示功能,比如百度搜索.我们只要输入相应的关键字,就可以自动得到相似搜索关键字的提示,方便我们快速的输入关键字进行查询. 那么在ASP.NET中,如果我们需 ...
- 基于JQuery实现的文本框自动填充功能
1. 实现的方法 /* * js实现的文本框的自动完成功能 */ function doAutoComplete(textid,dataid,url){ $("#" + texti ...
- chrome下input文本框自动填充背景问题解决
chrome下input文本框会自动填充背景,只需要给文本框加一个样式即可解决问题 input:-webkit-autofill {-webkit-box-shadow: 0 0 0px 1000px ...
- 原生Ajax GET+POST请求无刷新实现文本框用户名是否被注册
实现Ajax需要使用一个核心对象XMLHttpRequest XMLHttpRequest对象可以在不向服务器提交整个页面的情况下,实现局部更新网页.当页面全部加载完毕后,客户端通过该对象向服务器请求 ...
- Chrome表单文本框自动填充黄色背景色样式
chrome表单自动填充后,input文本框的背景会变成偏黄色的,这是由于chrome会默认给自动填充的input表单加上input:-webkit-autofill私有属性,然后对其赋予以下样式: ...
随机推荐
- eclipse中js中文乱码问题的解决办法
在Eclipse中编辑JS文件简直是一种折磨,但是却总是很无奈得要去适应. 这里说一下Eclipse中,编辑JS文件时候,出现中文乱码问题的解决办法. 这个问题很容易想到是文件编码的问题,因此通常是修 ...
- JQuery之Ajax基础
众所周知JQuery中的Ajax主要用于数据传输,其数据传输格式为JSON格式数据,比XML格式数据传输更快. ajax 是 Asynchronous JavaScript and XML的简写,aj ...
- .NET Core 轻量级模板引擎 Mustachio
一. 前言 Mustachio 是一款轻量级且强大的模板引擎,可以用在网页渲染.代码生成器等需要模板引擎的场景.我用它是用在配置文件模板化的场景,在配置文件里面编写一些模板语法,然后从 Cloud 拉 ...
- NLTK实现文本切分
之前已经了解了使用nltk库,将文本作为参数传入相应函数进行切分的方法,下面看看使用正则表达式如何来进行文本切分. 1. 使用正则表达式切分 1.1 通过RegexpTokenizer 进行切分.先导 ...
- iOS多线程知识梳理
iOS多线程知识梳理 线程进程基础概念 进程 进程是指在系统中正在运行的一个应用程序 每个进程之间是独立的,每个进程均运行在其专用且受保护的内存空间内 线程 1个进程要想执行任务,必须得有线程(每1个 ...
- 分析Android APK- smali 语言简介
2.1 smali 语言简介 1.smali apk文件通过apktool反编译出来的都有一个smali文件夹,里面都是以.smali结尾的文件. smali语言是Davlik的寄存器语言,语法上和汇 ...
- 百度BAE专业版申购SSL证书
这几天开发了一个小程序,本来想放到BAE基础版的,但是基础版现在不能再新增项目了,想了一下,出点血,配了个专业版.但是专业版的SSL证书是需要配的,而小程序必须使用https,所有必须申请一个证书.在 ...
- PS各种行业文件创建
ps可以运用于:印刷.喷绘.网络等行业. 印刷 创建的印刷文件需要修改为毫米为单位,分辨率300以上,CMYK颜色格式: 16开的尺寸为:210*285mm:但在印刷之后,剪裁需要留出出血位,上下左右 ...
- Linux中ps -elf和ps aux的区别
一.前言 Linux下输入命令man ps查看: 加横线是 standard syntax -- 比如ps -elf 不加横线是 BSD syntax -- 比如ps aux To see ...
- C++ std::array 基本用法
#include <iostream> #include <string> #include <array> using namespace std; // htt ...