How do i change Background color of textbox when onfocus?

Question

i tried this code but its not working.. when i on-focus textbox it shows error

   function ChangeBgColor(obj, evt) 
    { 
            if(evt.type==\"focus\"         


        

Answer 1

Yep, you should try this javascript code to change the background color for this element:

  var obj = document.getElementById("yourId");
  obj.onfocus = function() {
    obj.style.backgroundColor = 'red';
  }

Now you can change whatever color you want

Answer 2

JavaScript is not necessary for this task, just use css (:focus is supported since IE8)

https://developer.mozilla.org/en-US/docs/CSS/:focus

input { background: lightgray; }
input:focus { background: white; }

---

Only if this effect is absolutely needed also on < IE8 then JS (properly wrapped in a conditional comment) can be used, but even in this scenario it is recommended to keep off style from logic: e.g.

function ChangeBgColor(obj, evt) { 
    obj.className = (evt.type === "focus") ? "focus" : "";
}

and use this style

 input { background: lightgray; }

 input:focus, 
 input.focus { background: white; }

Answer 3

obj.style.background = "#C8C8C8";

Answer 4

Try doing it with jQuery.

$('#div').on('focus', function() {
    $(this).css({background:'blue'});
});

Answer 5

What is style? You have not defined it anywhere in your code above:

function ChangeBgColor(obj, evt) 
{ 
    if(evt.type=="focus") 
        style.background ="lightgrey";  //<--what is style?
    else if(evt.type=="blur") 
    {
        style.background="white";
    }          
}

I am guessing that you wanted something like

obj.style.background ="lightgrey";

And in the code above, simplified

function ChangeBgColor(obj, evt) 
{ 
    obj.style.background = (evt.type=="focus") ? "lightgrey" : "white";
}

The best answer is to use pure CSS.