Question

我想设置文本字段的黄色背景，当它获得焦点时（仅使用JavaScript）。我试过了

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;
}

Answer 1

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>

Answer 2

试试这个

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

Reference

Answer 3

你的语法有些错误，但这应该有效：

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

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

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

Answer 4

Javascript中的背景颜色写为“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>

您输入了：没有

Answer 5

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

设置文本字段onfocus的背景颜色

5 个答案: