zoukankan      html  css  js  c++  java
  • html中div获取焦点,去掉input div等获取焦点时候的边框

    经测试只有在IE chrome才会在获取焦点时有边框

    使用CSS

    div{
        outline:none;
    }

    DIV焦点事件详解 --【focus和tabIndex】​

    摘自:http://my.oschina.net/jgy/blog/131970

    添加 tabindex='-1' 属性;

    默认:获取不到焦点事件(blur)

    <div class="wl-product" id="wl-product"></div>

    可以获取焦点事件(blur)

    <div class="wl-product" id="wl-product" tabindex='-1'></div>

    首先看看w3c关于onfocus的部分
    The onfocus event occurs when an element receives focus either by the pointing device or by tabbing navigation. 
    This attribute may be used with the following elements: A, AREA, LABEL, INPUT, SELECT, TEXTAREA, and BUTTON. 
    当元素通过指定(点击)或tab导航(Tabbing navigation)获得焦点,onfocus事件就会触发。
    该属性会使用在以下元素(就是说默认可以获取焦点的元素):A, AREA, LABEL, INPUT, SELECT, TEXTAREA, and BUTTON.

     div, frameSet, span, table, td.只有设置tableindex才能获取焦点,但

    IE默认能获取焦点但不能tab导航

    不同tabIndex值在tab order(Tabbing navigation)中的情况:
    Objects with a positive tabIndex are selected in increasing iIndex order and in source order to resolve duplicates.
    Objects with an tabIndex of zero are selected in source order. 
    Objects with a negative tabIndex are omitted from the tabbing order.
    tabIndex值是正数的对象根据递增的值顺序和代码中的位置顺序来被选择
    tabIndex值是0的对象根据在代码中的位置顺序被选择
    tabIndex值是负数的对象会被忽略

  • 相关阅读:
    ClickHouse之访问权限控制
    ClickHouse之集群搭建以及数据复制
    ClickHouse之简单性能测试
    ClickHouse之初步认识
    从完整备份恢复单个innodb表
    MHA快速搭建
    MySQL 5.7最新版本的2个bug
    Greenplum各种Tips(不定时更新)
    MySQL 5.7贴心参数之binlog_row_image
    TCP窗口机制与流量控制
  • 原文地址:https://www.cnblogs.com/fenglie/p/4186315.html
Copyright © 2011-2022 走看看