javascript - Unable to get property 'style' of undefined or null reference - Stack Overflow

admin管理员组

文章数量:1315308

I have been looking online for a Watermark effect for my textboxes to get some help and found a piece of code which looks like the following :

Javascript:

function WaterMark(objtxt, event) {
var defaultText = "Username";
var defaultpwdText = "Password";
// Condition to check textbox length and event type
if (objtxt.id == "tb_Username" || objtxt.id == "tb_Password") {
    if (objtxt.value.length == 0 & event.type == "blur") {
        //if condition true then setting text color and default text in textbox
        if (objtxt.id == "tb_Username") {
            objtxt.style.color = "Gray";
            objtxt.value = defaultText;
        }
        if (objtxt.id == "tb_Password") {
            document.getElementById("<%= tb_TempPassword.ClientID %>").style.display = "block";
            objtxt.style.display = "none";
        }
    }
}
// Condition to check textbox value and event type
if ((objtxt.value == defaultText || objtxt.value == defaultpwdText) & event.type == "focus") {
    if (objtxt.id == "tb_Username") {
        objtxt.style.color = "black";
        objtxt.value = "";
    }
    if (objtxt.id == "tb_TempPassword") {
        objtxt.style.display = "none";
        document.getElementById("<%= tb_Password.ClientID %>").style.display = "";
        document.getElementById("<%= tb_Password.ClientID %>").focus();
    }
}

}

Then the HTML:

<asp:TextBox runat="server" ID="tb_Username" Text="Username" onblur="WaterMark(this, event);" onfocus="WaterMark(this, event);" />

<asp:TextBox runat="server" ID="tb_TempPassword" Text="Password" onfocus="WaterMark(this, event);" ForeColor="Gray" />

<asp:TextBox runat="server" ID="tb_Password" TextMode="Password" text="Password" Style="display:none" onblur="WaterMark(this, event);"/>

But for some reason when i run my code the Username box works fine but the password box es up with an error saying:

0x800a138f - JavaScript runtime error: Unable to get property 'style' of undefined or null reference

I have been looking online for a fix and nothing is working? Is this because my Textbox is linking to a CSS stylesheet?

Any help would be greatly appreciated.

I have been looking online for a Watermark effect for my textboxes to get some help and found a piece of code which looks like the following :

Javascript:

function WaterMark(objtxt, event) {
var defaultText = "Username";
var defaultpwdText = "Password";
// Condition to check textbox length and event type
if (objtxt.id == "tb_Username" || objtxt.id == "tb_Password") {
    if (objtxt.value.length == 0 & event.type == "blur") {
        //if condition true then setting text color and default text in textbox
        if (objtxt.id == "tb_Username") {
            objtxt.style.color = "Gray";
            objtxt.value = defaultText;
        }
        if (objtxt.id == "tb_Password") {
            document.getElementById("<%= tb_TempPassword.ClientID %>").style.display = "block";
            objtxt.style.display = "none";
        }
    }
}
// Condition to check textbox value and event type
if ((objtxt.value == defaultText || objtxt.value == defaultpwdText) & event.type == "focus") {
    if (objtxt.id == "tb_Username") {
        objtxt.style.color = "black";
        objtxt.value = "";
    }
    if (objtxt.id == "tb_TempPassword") {
        objtxt.style.display = "none";
        document.getElementById("<%= tb_Password.ClientID %>").style.display = "";
        document.getElementById("<%= tb_Password.ClientID %>").focus();
    }
}

}

Then the HTML:

<asp:TextBox runat="server" ID="tb_Username" Text="Username" onblur="WaterMark(this, event);" onfocus="WaterMark(this, event);" />

<asp:TextBox runat="server" ID="tb_TempPassword" Text="Password" onfocus="WaterMark(this, event);" ForeColor="Gray" />

<asp:TextBox runat="server" ID="tb_Password" TextMode="Password" text="Password" Style="display:none" onblur="WaterMark(this, event);"/>

But for some reason when i run my code the Username box works fine but the password box es up with an error saying:

0x800a138f - JavaScript runtime error: Unable to get property 'style' of undefined or null reference

I have been looking online for a fix and nothing is working? Is this because my Textbox is linking to a CSS stylesheet?

Any help would be greatly appreciated.

• javascript
• html
• asp

Share Improve this question Follow asked Apr 28, 2014 at 10:49 user3507542user3507542 1311 gold badge11 silver badge77 bronze badges 2

• Pay attention the the id(s). the ID attribute of an asp:TextBox differs from the generated id resulting from processing the TextBox. The input id is not tb_Password. – user1047100 Commented Apr 28, 2014 at 11:00
• @Geeo How would i get around this? – user3507542 Commented Apr 28, 2014 at 11:01

Add a ment  | 

4 Answers 4

Sorted by: Reset to default 0

Try this..

    var id=objtxt.id.toString();
    document.getElementById(id).setAttribute("style", "color:Gray");

Please check if you are getting value of document.getElementById("<%= tb_Password.ClientID %>") or not?

value of document.getElementById("<%= tb_Password.ClientID %>") should not be null.

You can also use .hide() and .show() functions.

In my case the following worked -

I placed the script just before closing tag of ( as I am using a masterpage) and instead of writing getelementbyid(menuid.UniqueID) I wrote getelementbyid(menuid.ClientID).

I am also facing this problem and I solve it myself. The issue is related to panel and this panel visible property is false. instead of this set it as display as none value. now its working.

本文标签： javascriptUnable to get property 39style39 of undefined or null referenceStack Overflow