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()。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。