Javascript - Focus()用法及代码示例

JavaScript focus方法用于将焦点赋予html元素。它将元素设置为当前文档中的活动元素。它可以一次应用于当前文档中的一个html元素。该元素可以是按钮，文本字段或窗口等。所有浏览器都支持该元素。
用法:

HTMLElementObject.focus()

参数：它不接受任何参数。
返回值：此方法不返回任何值。

JavaScript代码显示此函数的工作方式：
代码:
将重点放在将鼠标悬停在该字段上的输入字段上。

<html> 
  
<head> 
    <script type="text/javascript"> 
        function myFunction() { 
            document.getElementById("focus").focus(); 
        } 
    </script> 
</head> 
  
<body> 
    <form action="#"> 
        <br> 
        <br> 
        <label> 
            Hover me:</label> 
        <input type="text" onmousemove=myFunction() id="focus"> 
        
        <!-- onmousemove is an event which occurs when somenone  
        hovers the mouse on that particular element and calls  
        the function of javascript --> 
        <br> 
        <br> 
        <label>Without Focus:</label> 
        <input type="text"> 
        <br> 
        <br> 
        <input type="button" value="submit"> 
    </form> 
</body> 
</html>

输出：

可以使用javascript中的blur()方法删除焦点字段。句法：

HTMLElementObject.blur()

参数：此方法不接受任何参数。
单击字段时模糊方法的插图：
Code:

<html> 
  
<head> 
    <script type="text/javascript"> 
        function setFocus() { 
            document.getElementById("focus").focus(); 
        } 
  
        function removeFocus() { 
            document.getElementById("focus").blur(); 
        } 
    </script> 
</head> 
  
<body> 
    <input type="button" onclick="setFocus()" value="set focus"> 
    <input type="button" onclick="removeFocus()" value="remove focus"> 
    <br> 
    <br> 
    <input type="text" id="focus"> 
</body> 
  
</html>

输出：
点击设置焦点后，

点击移除焦点后，

相关用法

JQuery focus()用法及代码示例

注：本文由纯净天空筛选整理自revantjain大神的英文原创作品 JavaScript | Focus()。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。