change css using javascript
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="Javascript._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<script language="javascript" type="text/javascript">
function ClearValue() {
var txtName = document.getElementById('<%=txtName.ClientID %>');
txtName.value = hidden.value
txtName.className = ''
txtName.className = 'TextBox2'
}
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title></title>
<style type="text/css">
.TextBox
{
width: 150px;
border: Solid 1px MistyRose;
font-family: Verdana;
font-style: normal;
color: #333333;
text-decoration: none;
font-size: 0.8em;
}
.TextBox2
{
width: 300px;
border: Solid 6px MistyRose;
font-family: Verdana;
font-style: normal;
color: #000000;
text-decoration: none;
font-size: 0.3em;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="javascript:ClearValu开发者_开发百科e()" />
<asp:TextBox ID="txtName" runat="server" CssClass="TextBox"></asp:TextBox>
<br />
</div>
</form>
</body>
</html>
here am trying to change the Css for the text box using javascript.
which is not happening any idea how to solve this issue
thanks
Your script probably stops because there is no hidden value anywhere.
You also have an extra } at the end of the script.
This should work:
function ClearValue() {
var txtName = document.getElementById('<%=txtName.ClientID %>');
txtName.className = '';
txtName.className = 'TextBox2';
}
Thought this will also work well in modern browsers (though broken in older versions of IE, thanks @David Dorward):
function ClearValue() {
var txtName = document.getElementById('<%=txtName.ClientID %>');
txtName.setAttribute('class', '');
txtName.setAttribute('class', 'TextBox2');
}
You really should try using jQuery which makes this kind of thing a doddle:
function ClearValue()
{
$('<%=txtName.ClientID %>').toggleClass('TextBox2');
}
try with
txtName.setAttribute("class",'TextBox2);
txtname.setAttribute("className", newClass); //For IE; harmless to other browsers.
From http://www.webdeveloper.com/forum/showthread.php?t=134282
加载中,请稍侯......
精彩评论