簡體   English   中英

使用javascript更改CSS

[英]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:ClearValue()" />
        <asp:TextBox ID="txtName" runat="server" CssClass="TextBox"></asp:TextBox>
        <br />
    </div>
    </form>
</body>
</html>

在這里,我嘗試使用javascript更改文本框的CSS。

這沒有發生任何想法如何解決這個問題

謝謝

您的腳本可能會停止,因為任何地方都沒有hidden值。

腳本末尾還有一個額外的}

這應該工作:

function ClearValue() {
   var txtName = document.getElementById('<%=txtName.ClientID %>');
   txtName.className = '';
   txtName.className = 'TextBox2';
}

認為這在現代瀏覽器中也能很好地工作(盡管在舊版本的IE中已損壞,感謝@David Dorward ):

function ClearValue() {
   var txtName = document.getElementById('<%=txtName.ClientID %>');
   txtName.setAttribute('class', '');
   txtName.setAttribute('class', 'TextBox2');
}

您確實應該嘗試使用jQuery ,它使這種事情變得輕而易舉:

function ClearValue()
{
   $('<%=txtName.ClientID %>').toggleClass('TextBox2');
}

嘗試

txtName.setAttribute("class",'TextBox2);
             txtname.setAttribute("className", newClass); //For IE; harmless to other browsers.

來自http://www.webdeveloper.com/forum/showthread.php?t=134282

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM