给当前选中的控件提供高亮显示功能

最新推荐文章于 2022-09-02 16:04:16 发布

原创最新推荐文章于 2022-09-02 16:04:16 发布 · 691 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#textbox #radiobutton #attributes #string #input

本文介绍了一种在Web应用程序中为控件添加高亮效果的方法。通过在控件获得焦点时修改其样式属性，实现了视觉上的突出显示。此方法适用于多种控件类型，并提供了示例代码。

想要的效果是让当前选中的控件有一个高亮的效果.

要实现这个功能要先有一个给控件添一个Attributes 的方法.

#region SetInputControlsHighlight
/// <summary>
/// 设置当控件得到焦点的时候,控件的样式.
/// </summary>
/// <param name="container">指定的控件.</param>
/// <param name="className">应用样式的样式名称</param>
/// <param name="onlyTextBoxes">是否只允许TextBox有这个属性.</param>
public static void SetInputControlsHighlight(Control container,
string className, bool onlyTextBoxes)
{
foreach (Control ctl in container.Controls)
{
//在if里面可以加想要的控件.
if ((onlyTextBoxes && ctl is TextBox) || ctl is TextBox ||
ctl is DropDownList || ctl is ListBox || ctl is CheckBox ||
ctl is RadioButton || ctl is RadioButtonList || ctl is CheckBoxList)
{
WebControl wctl = ctl as WebControl;
wctl.Attributes.Add("onfocus", string.Format(
"this.className = '{0}';", className));
wctl.Attributes.Add("onblur", "this.className = '';");
}
else
{
if (ctl.Controls.Count > 0)
SetInputControlsHighlight(ctl, className, onlyTextBoxes);
}
}
}
#endregion

为了要个控件添加这个属性.要重写Onload();

protected override void OnLoad(EventArgs e)
{
// add onfocus and onblur javascripts to all input controls on the forum,
// so that the active control has a difference appearance
//设置当前空间的样式.
Helpers.SetInputControlsHighlight(this, "highlight", false);
base.OnLoad(e);
}

别忘了还要有一个样式单:

/***********************************************
/ 设置当前选中控件的样式.
/***********************************************/
.highlight
{
background-color: #fefbd2;
color: #000080;
}