如何用JS实现div失去焦点事件

Posted 2023-04-24

参考技术A <script src="js/jquery.js"></script>
<script>
$(function()
    $(".a").mouseover(function()
        $(this).css("border-color", "black");
    ).mouseout(function()
        $(this).css("border-color", "transparent");
    );
);
</script>
<style>
.a  padding: 50px; background: red; width: 100px; border: 5px solid transparent;  
</style>
<div class="a"></div>

jquery一个div怎么获得焦点和失去焦点

DIV获取焦点（两种方法）：
DIV直接使用focus()和blur()两个方法是无效的，需添加tabindex="0"或者contenteditable="true"属性
①：设置div为可编辑状态，则可点击获取焦点，同时div的内容也是可以编辑的；如：
<div contenteditable="true">11111111111111</div>
②：设置div的tabindex，此时div的内容是不可编辑的；如：
<div tabindex="0">11111111111111</div>
PS:设置tabindex属性，按键盘Tab键可让其获取焦点，其中tabindex的值越小在tab键切换的时候就会首先聚焦 参考技术A

DIV获取焦点有两种方法：

DIV直接使用focus()和blur()两个方法是无效的，需添加tabindex="0contenteditable="true"属性，设置div为可编辑状态，则可点击获取焦点，同时div的内容也是可以编辑的，
设置div的tabindex，此时div的内容是不可编辑的。

PS:设置tabindex属性，按键盘Tab键可让其获取焦点，其中tabindex的值越小在tab键切换的时候就会首先聚焦