从代码中更改CSS类

问题描述：

在代码隐藏中很容易设置CssClass，但这会覆盖现有类的风险。从代码中更改CSS类

我需要某些元素设置为ReadOnly = true;，我想申请一个风格为视觉提示，该项目无法改变......很容易：

.CssClass += " ReadOnlyStyle";

但有时我会也需要更改相同的元素ReadOnly = false;这意味着我将需要删除我设置的CSS类，而无需删除我可能已分配的任何其他样式。

这样做的最好方法是什么？

答

我已经采取AnthonyWJones原代码和修改它，这样它的作品无论在什么情况下：

static class WebControlsExtensions 
    { 
     public static void AddCssClass(this WebControl control, string cssClass) 
     { 
      List<string> classes = control.CssClass.Split(new char[] { ' ' }, StringSplitOptions.RemoveEmptyEntries).ToList(); 

      classes.Add(cssClass); 

      control.CssClass = classes.ToDelimitedString(" "); 
     } 

     public static void RemoveCssClass(this WebControl control, string cssClass) 
     { 
      List<string> classes = control.CssClass.Split(new char[] { ' ' }, StringSplitOptions.RemoveEmptyEntries).ToList(); 

      classes.Remove(cssClass); 

      control.CssClass = classes.ToDelimitedString(" "); 
     } 
    } 

    static class StringExtensions 
    { 
     public static string ToDelimitedString(this IEnumerable<string> list, string delimiter) 
     { 
      StringBuilder sb = new StringBuilder(); 
      foreach (string item in list) 
      { 
       if (sb.Length > 0) 
        sb.Append(delimiter); 

       sb.Append(item); 
      } 

      return sb.ToString(); 
     } 
    }

答

你可以制作自己的自定义类吗？从ASP.NET按钮派生并为只读添加一个属性。某处......可能在OnPreRender中，您可以检查新的属性并相应地设置（或不设置）CSSClass属性。

答

在C＃3中，您可以添加一些扩展方法。

static class WebControlsExtensions 
{ 
    public static void AddCssClass (this WebControl control, string cssClass) 
    { 
     control.CssClass += " " + cssClass; 
    } 
    public static void RemoveCssClass (this WebControl control, string cssClass) 
    { 
     control.CssClass = control.CssClass.replace(" " + cssClass, ""); 
    } 
}

用法： -

ctl.AddCssClass("ReadOnly"); 
ctl.RemoveCssClass("ReadOnly");

注意RemoveCssClass被设计成只删除AddCssClass添加这些类和有限制，即当添加2个额外的类名最短的名字不应该严丝合缝最长的名字的开始。例如，如果添加了“测试”和“测试2”，则无法在不破坏CssClass的情况下移除测试。这可以通过RegEx改进，我期望上述内容足以满足您的需求。

请注意，如果您没有C＃3，请从第一个参数中删除this关键字，并按常规方式使用静态方法。

如果您要删除原始CSS样式，RemoveCssClass将不起作用。 – 2009-01-15 10:03:06

@John：很明显，我曾暗指过：“RemoveCssClass被设计为只删除由AddCssClass添加的那些类”。 – AnthonyWJones 2009-01-15 14:57:55

答

这个版本检查，以确保给定的类不加入之前已经添加。

public static void CssAddClass(this WebControl control, string className) 
{ 
    var classNames = control.CssClass.Split 
     (new[] { ' ' }, StringSplitOptions.RemoveEmptyEntries); 

    if (classNames.Contains(className)) 
    { 
     return; 
    } 

    control.CssClass = string.Concat 
     (classNames.Select(name => name + " ").ToArray()) + className; 
} 

public static void CssRemoveClass(this WebControl control, string className) 
{ 
    var classNames = from name in control.CssClass. 
         Split(new[] {' '}, StringSplitOptions.RemoveEmptyEntries) 
        where name != className 
        select name + " "; 


    control.CssClass = string.Concat(classNames.ToArray()).TrimEnd(); 
}

答

我为前C＃3版本：

 public static class WebControlsExtensions 
     { 
      public static void AddCssClass(WebControl control, string cssClass) 
      { 
       string[] cssClasses = control.CssClass.Split(new char[] { ' ' }, StringSplitOptions.RemoveEmptyEntries); 
       List<string> classes = new List<string>(cssClasses); 

       if (!classes.Contains(cssClass)) { 
        classes.Add(cssClass); 
       } 

       control.CssClass = StringExtensions.ToDelimitedString(classes, " "); 
      } 

      public static void RemoveCssClass(WebControl control, string cssClass) 
      { 
       string[] cssClasses = control.CssClass.Split(new char[] { ' ' }, StringSplitOptions.RemoveEmptyEntries); 
       List<string> classes = new List<string>(cssClasses); 

       bool removed = true; 
       while (removed) { 
        removed = classes.Remove(cssClass); 
       } 

       control.CssClass = StringExtensions.ToDelimitedString(classes, " "); 
      } 
    } 
    static class StringExtensions { 
     public static string ToDelimitedString(List<string> list, string delimiter) 
     { 
      StringBuilder sb = new StringBuilder(); 
      foreach (string item in list) { 
       if (sb.Length > 0) 
        sb.Append(delimiter); 

       sb.Append(item); 
      } 

      return sb.ToString(); 
     } 
    }

使用，如：

WebControlsExtensions.AddCssClass(ctl, "classname"); 
WebControlsExtensions.RemoveCssClass(ctl, "classname");

这一个只会增加一类，如果它不是已经存在。它也将删除一个类的所有实例（如果由于某种原因，在那里有多个）

答

纯.NET 2.0（没有扩展！没有LINQ！没有RegEx！没有不必要的WebControl类！）。这些方法是相当一般的，仅用于CSS类。

另外，看看我的CssClassManipulator。

public static string AddCssClass(string classContainer, string className) 
    { 
     if (string.IsNullOrEmpty(classContainer)) return className ?? string.Empty; 
     if (string.IsNullOrEmpty(className)) return classContainer; 

     var classNames = classContainer.Split(new[] { ' ' }, StringSplitOptions.RemoveEmptyEntries); 
     if (Array.Exists(classNames, delegate(string s) { return s.Equals(className); })) return classContainer; 

     return classContainer + " " + className; 
    } 

    public static string RemoveCssClass(string classContainer, string className) 
    { 
     if (string.IsNullOrEmpty(classContainer)) return className ?? string.Empty; 
     if (string.IsNullOrEmpty(className)) return classContainer; 

     var classNames = classContainer.Split(new[] { ' ' }, StringSplitOptions.RemoveEmptyEntries); 
     int index = Array.FindIndex(classNames, delegate(string s) { return s.Equals(className); }); 
     if (index >= 0) 
     { 
      return string.Join(" ", classNames, 0, index) + 
       ( index + 1 < classNames.Length ? 
        " " + string.Join(" ", classNames, index + 1, classNames.Length - index - 1) 
        : 
        string.Empty ); 
     } 

     return classContainer; 
    } 

    public static string ToggleCssClass(string classContainer, string className) 
    { 
     if (string.IsNullOrEmpty(classContainer)) return className ?? string.Empty; 
     if (string.IsNullOrEmpty(className)) return classContainer; 

     var classNames = classContainer.Split(new[] { ' ' }, StringSplitOptions.RemoveEmptyEntries); 

     if (Array.Exists(classNames, delegate(string s) { return s.Equals(className); })) return RemoveCssClass(classContainer, className); 

     return classContainer + " " + className; 
    }

答

相关...如果你只是想根据条件切换一个类...

bool disable = true;  // this will vary (true/false) based on UI state 

string newClass = disable ? "BtnGray" : "BtnPink"; 

string currentClass = disable ? "BtnPink" : "BtnGray"; 

myButton.CssClass = myButton.CssClass.Replace(currentClass, newClass);

从代码中更改CSS类

相关推荐