設置文本框的背景顏色onfocus

我想設置文本框的黃色背景，當它獲得焦點（僅適用於JavaScript）。我試圖設置文本框的背景顏色onfocus

txt.style.backgroundcolor = 'yellow';

和

txt.style = 'background-color: yellow';

和

txt.class = 'yellow';

但他們沒有工作。

下面是代碼：

<html> 
<head> 
<script language="JavaScript" src="form.js" type="text/javascript"></script> 
<style> 
.yellow { 
    background-color: yellow; 
} 
</style> 
</head> 
<body> 
    <input type='text' size='15' name='txta' Id='txta' 
     onfocus='txt_onfocus(this)' onchange='txt_onchange(this)'></input> 
    <br> 
    <input type='text' size='15' name='txtb' Id='txtb' 
     onfocus='txt_onfocus(this)' onchange='txt_onchange(this)'></input> 
    <br> 
    <Span id='span1'><span> 
</body> 
</html>

JS：

function txt_onchange(txt) { 
    document.getElementById('span1').innerHTML = txt.value; 
} 

function txt_onfocus(txt) { 
    txt.style.backgroundcolor = yellow; 
}

來源

2014-02-19 user3326849

檢查[？我如何改變文本框的背景顏色時的onfocus（http://stackoverflow.com/questions/15975078/how-do -i-change-background-color-of-textbox-when-onfocus） –

在Google或Stack Overflow上進行的搜索會產生許多對你的問題的答案，並且可能比創建問題和等待答案更快。這就是說雖然這裏是一個很好的資源，如果你開始使用JS：http://www.w3schools.com/js/default.asp –

有在CSS的好方法。您可以使用CSS 重點Link

<!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 type="text" name="firstname" /><br> 
Last name: <input type="text" name="lastname" /> 
</form> 

<p><b>Note:</b> For :focus to work in IE8, a DOCTYPE must be declared.</p> 

</body> 
</html>

來源

2014-02-19 07:22:46

謝謝，但我想通過javascript，我現在正在探索javascript函數。 – user3326849

即使你正在瀏覽JavaScript，你仍然應該認爲這是一個很好的答案。如果存在本土方式，您應該接受它，因爲它總是會更快更高效。使用CSS：focus僞類是比使用JS更好的解決方案;假設您的瀏覽器受衆人口支持它。 –

-1

function txt_onfocus(txt){txt.style.backgroundColor='yellow';}

來源

2014-02-19 07:19:57 JJJ

謝謝，但仍然無法正常工作。 – user3326849

適用於我，你確定你正在複製功能？ http://jsfiddle.net/hDfNm/ – JJJ

試試這個

function txt_onfocus(txt) { 
    txt.style.background = "yellow"; 
}

Reference

來源

2014-02-19 07:29:08

很好的作品！ – user3326849

你有你的語法犯了一些錯誤，但是這應該工作：

http://jsfiddle.net/chrissp26/2Xgfr/124/

的JavaScript：

function txt_onfocus(txt) { 
    txt.style.backgroundColor = "yellow"; 
} 

function txt_onchange(txt) 
{ 
    document.getElementById('span1').innerHTML=txt.value; 
}

HTML的Javascript

<input type="text" size="15" name="txta" Id="txta" onfocus="txt_onfocus(this);" onchange="txt_onchange(this)"/> 

<br> <Span id='span1'><span>

來源

2014-02-19 07:32:03

背景顏色是寫「的backgroundColor」，也嘗試用十六進制，而不是顏色名稱。黃色是＃FFFF00，或者在兩個字符相同的情況下，在這種情況下＃FF0。

我還在您的HTML中添加了一個GO按鈕來強制模糊。點擊它可以退出輸入框並激活onchange事件。

<script type="text/javascript"> 
    function txt_onchange(obj) { document.getElementById('span1').innerHTML = obj.value; } 
    function txt_onfocus(obj){ obj.style.backgroundColor = "#FF0"; } 
</script> 
<HTML> 
<div id="wrap"> 
    <input type="text" size="15" name="txta" Id="txta" onfocus="txt_onfocus(this)" onchange="txt_onchange(this)"></input>&nbsp; 
    <input type="button" size="10" name="B1" value="Go"> <br> 
    <input type="text" size="15" name="txtb" Id="txtb" onfocus="txt_onfocus(this)" onchange="txt_onchange(this)"></input>

您輸入：沒什麼

來源

2014-02-19 08:38:03 AllanP

設置文本框的背景顏色onfocus

回答

相關問題