html - Change Text Box Background Color Using JavaScript - Stack Overflow

admin管理员组

文章数量:1391969

I have tried a few solutions I have seen and none of them are actually changing the background color of my text box. These are the 2 things I have tried
1) state.style.backgroundColor = "#FF0000"

2) state.style.backgroundColor = "red";

And this is the function I am trying to use

<script type="text/javascript">
function VerifyStateWasEntered() {
    var state;
    state = document.getElementByID("txtstate").value; 
    if (state == '') {
        alert("Error Please Enter A Valid State");
        state.style.backgroundColor = "red";
        return false;
    }}      

And this is the HTML I am using to create the text box

<asp:TextBox id="txtstate" runat="server" />

I have tried a few solutions I have seen and none of them are actually changing the background color of my text box. These are the 2 things I have tried
1) state.style.backgroundColor = "#FF0000"

2) state.style.backgroundColor = "red";

And this is the function I am trying to use

<script type="text/javascript">
function VerifyStateWasEntered() {
    var state;
    state = document.getElementByID("txtstate").value; 
    if (state == '') {
        alert("Error Please Enter A Valid State");
        state.style.backgroundColor = "red";
        return false;
    }}      

And this is the HTML I am using to create the text box

<asp:TextBox id="txtstate" runat="server" />

• javascript
• html
• asp

Share Improve this question Follow edited Nov 5, 2015 at 22:53 11mb 1,35922 gold badges1717 silver badges3333 bronze badges asked Oct 18, 2015 at 20:34 MustangLoverMustangLover 3511 gold badge11 silver badge66 bronze badges 1

• Since you use asp control you may run into a problem with .NET generating the id. In this case you get a pound of the control nestings ("MainContent_Login1_LoginPanel" say). Check the ClientIDMode setting in the Page directive and set the value to "static" to avoid this. – faester Commented Oct 18, 2015 at 20:38

Add a ment  | 

3 Answers 3

Sorted by: Reset to default 3

Can you try this? When you assign the state to the value, you cannot get the style object from value.

<script type="text/javascript">
function VerifyStateWasEntered() {
    var stateObj;

    stateObj = document.getElementByID("txtstate");
    if (stateObj) { 
      var stateValue = stateObj.value; 

      if (stateValue == '') {
        alert("Error Please Enter A Valid State");
        stateObj.style.backgroundColor = "red";
        return false;
      }}   
    }   
</script>

<asp:TextBox id="txtstate" runat="server" ClientIDMode="Static" />

What you are attempting is possible, but I suspect you use the wrong ID (as per my ment). To set the color of an element you can use the JavaScript below.

document.getElementById("txtstate").style.background = "red"

But you need to make sure you have ClientIdMode="static" on the page.

I get that you are trying to make the background color using Javascript but you can use CSS to do that and it will be much more easier.

Example:

<asp:TextBox id="txtstate" runat="server" />
<style type="text/css">
#txtstate {
background-color: /* the color you want */ ;
}

If that still doesn't work, try removing the closing / from <style type="text/css">. Good luck!

本文标签： htmlChange Text Box Background Color Using JavaScriptStack Overflow