在html里,如何在select下拉框里加个checkbox
你好,html自带的select元素,是不支持option中带checkbox的,所有如果想实现这样的特殊select,必须自己编写一个功能类似select的下拉框
我实现了一个简单的,你看下就会了,我用的箭头代表的三角,可以直接运行
<html>
<head>
<style>
ul{list-style-type:none;}
li{border:solid 1px;width:100px;}
.liShow{display:block;background:while;}
.liHide{display:none;background:blue;}
</style>
<script>
var nextState=1;
function change(obj){
var liArray=document.getElementsByTagName("LI");
var i=1;
var length=liArray.length;
switch(nextState){
case 1:
obj.innerHTML="当前选择↑";
for(;i<length;i++){
liArray[i].className="liShow";
}
nextState=0;
break;
case 0:
obj.innerHTML="当前选择↓";
for(;i<length;i++){
liArray[i].className="liHide";
}
nextState=1;
}
}
</script>
</head>
<body>
<ul id="myUl">
<li class="liMenu" onclick="change(this);">当前选择↓</li>
<li value="1" class="liHide"><input type="checkbox">1</li>
<li value="1" class="liHide"><input type="checkbox">2</li>
</ul>
</body>
</html>
html自带的select元素,是不支持option中带checkbox的,所有如果想实现这样的特殊select,必须自己编写一个功能类似select的下拉框。
超文本标记语言, 标准通用标记语言下的一个应用。
“ 超文本 ”就是指页面内可以包含图片、 链接,甚至音乐、 程序等非文字元素。
超文本标记语言的结构包括 “头”部分(英语:Head)、和“主体”部分(英语:Body),其中“头”部提供关于网页的信息,“主体”部分提供网页的 具体内容。
简易性:超级文本标记语言 版本升级采用 超集方式,从而更加灵活方便。
可扩展性:超级文本标记语言的广泛应用带来了加强功能,增加 标识符等要求,超级文本标记语言采取子类元素的方式,为系统扩展带来保证。
平台无关性:虽然 个人计算机大行其道,但使用 MAC等其他机器的大有人在,超级文本标记语言可以使用在广泛的平台上,这也是 万维网( WWW)盛行的另一个原因。