ASP.NET控件开发技巧之ComboBox显示是如何的呢？首先让我们来看看效果图：
先看下效果
ASP.NET控件开发技巧之ComboBox显示图一
ComboBox特性:
与DropDownList相比,可以自己输入文本,但HTML未提供这样的标签,所以只能利用现有的标签来模拟.
上面为截图,让我们来看下生成的HTML代码,此部分为局部代码.包含了两个集合
- ﹤table id="ComboBox2" class="comboBox" cellpadding="0" cellspacing="0"
- onmouseout="ComboBox2.HandleInputMouseOut()"
- onmouseover="ComboBox2.HandleInputMouseOver()" style="display:inline-block;width:200px;"﹥
- ﹤tr﹥
- ﹤td width="100%" id="ComboBox2_TextBox"﹥
- ﹤input id="ComboBox2_Input" name="ComboBox2_Input" autocomplete="off"
- onsubmit="return false;" type="text"
- class="comboTextBox" onfocus="ComboBox2.HandleFocus()"
- onblur="ComboBox2.HandleBlur(event)"
- onkeydown="ComboBox2.HandleKeyPress(event,this)" style="display:none;" /﹥﹤/td﹥
- ﹤td﹥
- ﹤img onmouseup="ComboBox2.HandleDropMouseUp(event,this)"
- onmousedown="ComboBox2.HandleDropClick(event,this)" src="images/drop.gif"
- id="ComboBox2_DropImage" style="display:block;" /﹥﹤/td﹥
- ﹤/tr﹥
- ﹤/table﹥
- ﹤div class="comboDropDown" id="ComboBox2_DropDown" style="display:none;"﹥
- ﹤table cellpadding="0" cellspacing="0" border="0" width="100%"﹥
- ﹤tr﹥
- ﹤td﹥﹤div id="ComboBox2_DropDownContent" onscroll="ComboBox2.HandleScroll(event,this)"
- onmousedown="ComponentArt_CancelEvent(event)"
- onmouseup="ComboBox2.HandleMouseUp(event,this)"﹥
- ﹤/div﹥﹤/td﹥
- ﹤/tr﹥
- ﹤/table﹥
- ﹤/div﹥
(1)一个table 里面存在着一个文本框和一个图片,看下图
ASP.NET控件开发技巧之ComboBox显示图二
(2)当选中右边的图片时,会出现一个下拉框,即把隐藏的div呈现出来,可以看到其初始化为隐藏,style="display:none;".看下图
ASP.NET控件开发技巧之ComboBox显示图三
两个组合在一起就形成了一个ComboBox控件。
ASP.NET控件开发技巧之ComboBox显示就向大家介绍到这里，关于ComboBox显示等相关的内容在以后的文章中还会提及。
【编辑推荐】
