<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>selected</title>
<script type="text/javascript" src='selected1.js'></script>
</head>
<body>
<TABLE style="WIDTH: 100%">
<TBODY>
<TR>
<TD> </TD>
<TD id='dd'> </TD>
</TR>
<TR>
<TD> </TD>
<TD id='ff'> </TD>
</TR>
<TR>
<TD> </TD>
<TD id='hh'> </TD>
</TR>
</TBODY>
</TABLE>
</TABLE>
<SCRIPT>
//设置样式传入方式
var a = new SelectDiv("中国人", "ff", "", true);
a.addOption("江西省", "jx");
a.addOption("福建省", "fj");
a.addOption("浙江省", "zj");
a.addOption("江苏省", "js");
a.addOption("辽宁省", "ln");
a.addOption("广东省", "gd");
a.addOption("西藏自治区", "xz");
a.addOption("宁夏回族自治区", "nx");
a.addOption("内蒙古自治区", "nmg");
a.addOption("广西壮族自治区", "gx");
a.addOption("新疆维吾尔自治区", "xj");
a.saveSelf();
var s = SelectDiv.getCreateObj('中国人');
a.addOption("陕西省", "sx");
var b = new SelectDiv("民族", "dd", "300px");
b.addOption("布依族", "jx");
b.addOption("阿昌族", "fj");
b.addOption("白族", "zj");
b.addOption("彝族", "js");
b.addOption("满族", "ln");
b.addOption("回族", "gd");
b.setValue('gd;fj;jx;');
var s = SelectDiv.getCreateObj('民族');
//设置样式传入方式
var s = new SelectDiv("Test", "hh", "300px",false,true);
s.addOption("江西省", "jx");
s.addOption("福建省", "fj");
s.addOption("浙江省", "zj");
s.addOption("江苏省", "js");
//alert(s);
function getAllSelectItemDivId() {
var item = a.getAllSelectItemDiv();
alert("size:" + item.length);
for ( var i = 0; i < item.length; i++) {
alert(item[i].id);
}
}
function getAllCheckBox() {
var cb = a.getAllCheckBox();
alert("size:" + cb.length);
for ( var i = 0; i < cb.length; i++) {
alert(a.getSelectItemText(cb[i].value).innerText + "-->"
+ cb[i].value);
}
}
function getAllSelectNames(){
var sName = b.getSelectNameList();
for ( var i = 0; i < sName.length; i++) {
var name = sName[i];
alert(name);
}
}
</SCRIPT>
<br />
<input onclick="javascript:alert(s.getValue())" type="button" id="ww"
value=取得选择后的值 />
<br></br>
<input onclick="s.setValue('jx;js;xj;fj;zj;')" type=button value=设置值默认值 />
<br></br>
<input onclick="getAllSelectItemDivId()" type=button
value=获取下拉列表框中每一项Div的Id />
<br></br>
<input onclick="getAllCheckBox()" type=button value=获取下拉列表框中每一项的值和文本信息 />
<br></br>
<input onclick="getAllSelectNames()" type=button value=获取目前所创建的下拉表框的所有名字 /><br><br>
<input onclick='a.clearSelectListDiv()'type="button" value="清空下拉列表框以及所选种的对象" />
</body>
</html>
- 大小: 48.2 KB
分享到：
相关推荐
在IT行业中，模拟下拉列表框是一种常见的交互设计技术，特别是在网页或应用程序界面设计中。这种设计能够提供用户友好的体验，允许用户通过输入文本或使用键盘导航来选择选项。以下是对这一技术的详细说明： 1. **...
用层模拟下拉列表框 (简单)
CSS jQuery用ul模拟select下拉列表菜单效果，将表单中常用的Select列表框变换了样式，更加漂亮了，而且引入了jQuery，加上了动画效果，在下拉的时候，自动向下滑出，使Select不那么呆板了。
`div模拟select自定义下拉列表框`是一种常见做法，它利用JavaScript（如jQuery）和CSS来实现，可以提供比原生`<select>`元素更丰富的样式控制和交互体验。本篇将详细介绍这种技术及其应用。 一、为什么使用div模拟...
### 网页表单自动填写技术详解：下拉列表框、单选框、复选框自动填写方法 #### 一、网页下拉列表的自动填写实现方法 在现代Web应用开发中，为了提高用户体验及简化操作流程，网页表单自动填写功能逐渐成为一种重要...
在IT领域，尤其是在Web开发和UI设计中，创建具有多选功能的下拉列表框是一项常见的需求。传统的下拉列表通常只允许用户选择一个选项，但通过自定义和扩展，我们可以实现一个支持多选的下拉列表框。下面将详细讨论这...
这就是"div 模拟下拉列表"的主要应用场景。这个技术主要是通过CSS和JavaScript（通常会结合使用jQuery或其他JS库）来创建一个看起来和行为类似于`<select>`的组件，同时能够更好地控制样式和增加自定义功能。 在...
3. **模拟组合框**：组合框（也称为下拉列表框）结合了编辑框和列表框的功能，用户可以在输入框中直接输入，也可以从下拉列表中选择。在易语言中，模拟组合框通常用于节省界面空间，提供筛选功能或者限制用户只能从...
本项目是关于"jQuery带搜索过滤功能的下拉列表框"，这是一个增强用户界面的实用功能，尤其适用于有大量选项的下拉菜单。下面将详细介绍这个功能及其相关知识点。 1. **jQuery基本概念**： jQuery是由John Resig在...
"带下拉列表的搜索框"这一设计是模拟了HTML中的`<select>`元素，但提供了更多自定义和增强的功能。 `<select>`标签是HTML中用于创建下拉菜单的基本元素，它包含了多个`<option>`子元素，每个`<option>`代表一个可选...
在网页设计中，有时我们需要创建一个具有复选框功能的下拉列表，让用户可以多选选项。本示例提供了一种实现这一功能的方法，通过两种技术：使用纯HTML和CSS的DIV控制，以及利用JQUERY库。这两种方法都可以有效地增强...
在JavaScript中，我们首先需要创建一个HTML结构来模拟带复选框的下拉列表。`aa.htm`文件可能包含以下基础结构： ```html <!DOCTYPE html> 带复选框的下拉列表 选项1 选项2 选项3 ...
"手动样式仿select下拉列表框"就是一个这样的实践，它通过CSS和JavaScript等技术，使得原本样式单一的SELECT元素变得更为美观、交互性强。 在传统的HTML中，SELECT元素用于创建下拉列表，但其默认样式受到浏览器的...
模拟下拉选项框的基本HTML结构可能包括一个触发按钮和一个隐藏的列表。例如： ```html 选择项 ;"> 选项1 选项2 选项3 ``` 这里的`<button>`充当触发器，`<ul>`则是显示的选项列表。 2. **CSS样式**...
"带复选框的下拉列表"是一种交互式控件，常见于各种应用程序和网站中，允许用户在一组选项中进行多项选择。这个主题涉及到前端开发、GUI设计以及Windows API编程。 首先，我们来详细探讨这种控件的设计原理。带复选...
在“jquery自动滚动下拉列表框.zip”这个项目中，我们聚焦于一个特定的用户界面元素——下拉列表框，并探讨如何使用jQuery实现自动滚动的效果。这个功能通常用于创建动态、交互性更强的网页应用。 首先，我们需要...
易语言模拟组合框的下拉式效果源码,模拟组合框的下拉式效果,A鼠标在外单击,截获鼠标动作,外部单击事件,B鼠标在外单击,启动时钟,停止时钟,判断鼠标范围,鼠标动作,C鼠标在外单击,鼠标钩子函数,在外部单击,置窗口特征,...
二级下拉列表联动 select 网页 html5 学院、专业 选择的下拉列表 下载可用！！！
在JavaScript编程中，下拉列表（Dropdown List）是一种常见的用户界面元素，用于提供多项选择。在本项目中，我们探讨的是一款用JavaScript实现的“漂亮的下拉列表”，它具有多种特性，如支持主流浏览器，内置搜索...