焦點（）不工作在JavaScript或jQuery

我想着重於使用JavaScript的輸入元素。這是html。焦點（）不工作在JavaScript或jQuery

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <style> 
 
    input:focus { 
 
     background-color: yellow; 
 
    } 
 
    </style> 
 
</head> 
 

 
<body> 
 

 
    <p>Click inside the text fields to see a yellow background:</p> 
 

 
    <form> 
 
    First name: <input id="abc" type="text" name="firstname"><br> 
 
    </form> 
 

 
</body> 
 

 
</html>

當我手動點擊使用鼠標，我可以看到黃色的背景。但是當我運行代碼$（'＃abc'）。focus（）或document.getElementById（'abc'）。focus（）我看不到黃色背景。如何使用JavaScript模擬鼠標焦點？

來源

2017-07-16 Vishnu Paspunoor

你的代碼的工作，這裏是[小提琴]（https：//開頭的jsfiddle .net/kukicvladimir/1n5o4qkf /）我無法重現問題 –

代碼正在工作，請嘗試檢查您是否在javascript中沒有任何語法錯誤或爲js文件命名空間路徑 –

如果這是所有代碼，那麼就沒有包括jQuery？ – mrbubbles

我不知道你在做什麼錯，但使用document.getElementById('abc').focus()訪問輸入元素，我能夠看到黃色的背景。

const input = document.getElementById('abc'); 
 

 
input.focus();

<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <style> 
 
    input:focus { 
 
     background-color: yellow; 
 
    } 
 
    </style> 
 
</head> 
 

 
<body> 
 

 
    <p>Click inside the text fields to see a yellow background:</p> 
 

 
    <form> 
 
    First name: <input id="abc" type="text" name="firstname"><br> 
 
    </form> 
 

 
</body> 
 

 
</html>

來源

2017-07-16 16:59:29

僅供參考'它的工作原理，還有其他錯誤'應該是一個評論，而不是一個答案。 –

在這裏，你有它的工作。希望它有幫助。如果您在HEML的頭部分，就把這行中<script>

$("#boton").click(function() { 
 
    $("#abc").focus(); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<!DOCTYPE html> 
 
<html> 
 

 
<head> 
 
    <style> 
 
    input:focus { 
 
     background-color: yellow; 
 
    } 
 
    </style> 
 
</head> 
 

 
<body> 
 

 
    <p>Click inside the text fields to see a yellow background:</p> 
 

 
    <form> 
 
    First name: <input id="abc" type="text" name="firstname"><br> 
 
    </form> 
 
    <button id="boton"> Click Me to focus 
 
</button> 
 

 
</body> 
 

 
</html>

來源

2017-07-16 17:01:14

document.getElementById('abc').focus();會工作。

或者，如果你想用jQuery做到這一點，那麼你需要把這些代碼中的document.ready功能是這樣的：

$(document).ready(function(){ 
    $('#abc').focus(); 
});

來源

2017-07-16 17:01:43

不是 - 兩種說法都是錯誤的。 –

@ freedomn-m，你能告訴我如何？ –

Ok.1如果你把這個腳本放在'head'中，它會在body生成之前運行（這就是爲什麼我們在jquery中使用doc.ready的原因）。所以1不會工作，因爲'＃abc'元素不會存在。 2.您不需要*將jquery代碼放入doc.ready中，它會按照1，在頁面中出現時運行。如果你在主體的最後放置了$（'＃abc'）。focus（）'（沒有文檔就緒），它仍然可以工作。我們使用doc.ready，以便代碼不依賴於其在本體內的位置。 –

焦點（）不工作在JavaScript或jQuery

回答

相關問題