废话少说,见官方文档:

      

他的用法是:document.getElementById('username').focus();                   这样写在display:block;显示之后就可以自动激活input输入框啦!

这并不是最有意思的地方,最有意思的地方是他可以触发该元素的  相应  事件;

接下来来举个栗子:

       

<body>
        <input type="text" id="name"/>
        <button id="btn">点击获取焦点</button>
</body>
<script type="text/javascript">
         document.getElementById('btn').onclick = function(){
                document.getElementById('name').focus();
         };
         document.getElementById('name').onfocus = function(){
                alert(1);
         };
</script>

当然这个有趣的地方显得卵用不是很大,希望这个细节能给你解决问题的方法

另外一个就是select()方法:该方法是选中该区域的内容,在点击按钮进行复制文本的时候常用到

既然说到点击选中复制,附送一份点击实现Ctrl+c的功能函数

function copyXq(id){
    //选中文字
    document.getElementById(id).select();
    //创建range对象,代表页面上一段连续的区域
    const range = document.createRange();
    //selectNode : 选择整个节点,包括子节点  //selectNodeContents:选择节点的子节点
    range.selectNode(document.getElementById(id));
    //window.getSelection()方法获取鼠标划取部分的起始位置和结束位置
    const selection = window.getSelection();
    //rangeCount方法返回选区(selection)中range对象数量的只读属性
    if(selection.rangeCount > 0) selection.removeAllRanges();
    //老子翻译不出来了,这B怎么有那么多方法
    selection.addRange(range);
    document.execCommand('copy');
    alert("复制成功!");
};

该随笔主要是因为,萌新在刚开始走前端的时候一些细节会难以处理,所以记下的该笔记,那么,前路昭然,你我共进。

JavaScript显示文本框后自动获取焦点的更多相关文章

  1. pyqt5:标签显示文本框内容

    文本框(lineEdit)输入文本,标签(label)就会显示文本框的内容. 原理如下: 输入文本时,lineEdit控件发射信号textChanged(),label收到后触发setText()槽. ...

  2. SAP四代增强实现:销售订单复制项目文本时不需要显示文本框和回车

    最近接收到一个业务需求,在SAP依据销售订单复制时,如果订单里面的项目有多个文本,系统就会显示复制的文本框处理,让用户选择是否复制,这个就让销售很不舒服,如果有几十个项目,每个项目有几个文本,那就就要 ...

  3. javascript当文本框获得焦点设置边框

    javascript当文本框获得焦点设置边框:本章节介绍一下当文本框获得焦点以后如何设置文本框的边框样式,本来是一个非常简单的问题,但是有可能前台美工人员对javascript并不是太了解,所以还是通 ...

  4. 【JS】【3】标签显示几秒后自动隐藏

    $("#XXX").show().delay(2000).hide(0); 2000,0:可选,速度,(毫秒:"slow":"fast") ...

  5. IOS中文本框输入自动隐藏和自动显示

    uilabe和UIText扩展方法 +(UILabel*)LabWithFrame:(CGRect)_rect text:(NSString*)aText textColor:(UIColor*)aC ...

  6. 使用 jquery-autocomplete插件 完成文本框输入自动填充联想效果 解决兼容IE输入中文问题

    项目中有时会用到ajax自动补全查询,就像Google的搜索框中那样,输入汉字或者字母的首个字母,则包含这个汉字或者字母的相关条目会显示出来供用户选择,该插件就是实现这样的功能的.autocomple ...

  7. javaScript:让文本框内的最后一个文字的后面获得焦点

    //当失去交点以后 让文本框内的文字获得焦点 并且光标移到最后一个字后面 function myfocus(myid) { if(isNav){ document.getElementById(myi ...

  8. JavaScript 自定义文本框光标——初级版

    文本框(input或textarea)的光标无法修改样式(除了通过color修改光标颜色).但笔者希望个人创建自己的网站时,文本框的光标有属于自己的风格.所以,尝试模拟文本框的光标,设计有自己风格的光 ...

  9. Vue - 实现双击显示编辑框;自动聚焦点击的显示框;点击编辑框外的地方,隐藏编辑框

    实现这三个功能的踩坑记录. 1. 需求 在Vue中,有一个input, 双击时编辑文本,点击该input节点外的其他地方,则取消编辑. 那么这里有三个要实现的地方 第一是双击显示编辑框. 第二是自动聚 ...

随机推荐

  1. .net core Identity集成IdentityServer(3) 一键登出

    在客户端程序, 我们补充一键登出操作. 使用了idsv之后, 退出的操作需要删除本地cookie, 然后去请求认证服务器, 也删除认证服务器的cookie. 官网给的退出的代码 public asyn ...

  2. ORACLE 配置连接远程数据库

    ORACLE配置tnsnames.ora文件实例 客户机为了和服务器连接,必须先和服务器上的监听进程联络.ORACLE通过tnsnames.ora文件中的连接描述符来说明连接信息.一般tnsnames ...

  3. c# partial 关键字的使用

    C# 2.0 引入了局部类型的概念.局部类型允许我们将一个类.结构或接口分成几个部分,分别实现在几个不同的.cs文件中. 局部类型适用于以下情况: (1) 类型特别大,不宜放在一个文件中实现.(2) ...

  4. [Linux] PHP-FPM开启慢日志记录

    fpm:FastCGI Process Manager 是一种替代的PHP FastCGI实现,对于负载较重的站点非常有用. .先进的进程控制,优雅的停止启动 .能够使用不同的uid/gid/chro ...

  5. 2018-08-22 为中文API的简繁转换库添加迟到的持续集成

    前两天在V2EX偶遇反馈帖第一次见以汉字命名的 Java 类 - V2EX, 于是复习了一下半年多没碰的项目program-in-chinese/zhconverter. 前文介绍了发布过程: 在Ma ...

  6. T研究:国内云BPM市场规模尚小,预计2018年仅为3.29亿元

    文章摘要:T研究发现,目前国内云BPM市场规模不高,预计今年为3.29亿元,不过其增速稳定,未来发展仍可期. BPM?什么鬼?反正作为“菊外人”的小编是第一次听说. 其实,对于这个词,不光是小编,国内 ...

  7. 14.Odoo产品分析 (二) – 商业板块(7) –制造(1)

    查看Odoo产品分析系列--目录 一旦你收到了库存中所需的原材料,就可以开始生产终端产品了.ERP系统的部分功能是帮助您根据可用资源调度这些订单.其中一项资源是原产品.其他资源可以包括可用劳动力或特定 ...

  8. Java之static作用的全方位总结

    1.深度总结 引用一位网友的话,说的非常好,如果别人问你static的作用:如果你说静态修饰 类的属性 和 类的方法 别人认为你是合格的:如果是说 可以构成 静态代码块,那别人认为你还可以: 如果你说 ...

  9. Android EditText手机号格式化输入XXX-XXXX-XXXX

    先来效果图: 设置手机格式化操作只需要设置EditText的addTextChangedListener的监听,下面看代码 /*editText输入监听*/ et_activity_up_login_ ...

  10. Android为TV端助力 fragment 的用法以及与activity的交互和保存数据的方法,包括屏幕切换(转载)!

    转载请标明出处:http://blog.csdn.net/lmj623565791/article/details/37992017 1.管理Fragment回退栈 类似与Android系统为Acti ...