`
a25765339
  • 浏览: 61066 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

html select的动态创建和optgroup属性

 
阅读更多
<html>
<body>
	<script type="text/javascript">
			function createOptions(){
				var mySelect = document.getElementById("mySelect");
				var group=document.createElement('OPTGROUP');
				group.label = "JS创建的optgroup";
				mySelect.appendChild(group);
				mySelect.options.add(new Option("全部","all"));
				mySelect.options.add(new Option("上海市","sh"));
				mySelect.options.add(new Option("北京市","bj"));
				var defaultSelect =  mySelect.options[2];//参数只能是index,从0开始
				defaultSelect.selected = true;
			}
	</script>
	<form>
		<select style="width:150px">
         <optgroup label="--请选择">
         <option value="0">全部</option>
         <option value="1">上海市</option>
         <option value="2">北京市</option>
		</select>
	</BR></BR></BR>
		<select id="mySelect" name="mySelect" style="width:150px"></select>
		<input type="button" onclick="createOptions()" value="js创建optgroup" />
	</form>
</body>
</html>

分享到:
评论

相关推荐

    html中select optgroup标签使用介绍

    偶然需要对select 内容进行分组,以往都是用程序控制,今天发现 select 中还有一个 optgroup 属性可以用,试用心得如下,感兴趣的朋友可以参考下哈

    重写 DropDownList 添加optgroup

    重写 DropDownList 添加optgroup以及为ListItem 加式样(例如 背景色,前景色等)

    HTML5标签和属性列表.pdf

    HTML5标签和属性列表 HTML5是一种基于XML的标记语言,用于创建网页的结构和内容。 HTML5新增了许多新的标签和属性,提高了网页的可读性、可访问性和互操作性。本文档将对 HTML5 中的标签和属性进行详细的介绍。 ...

    select2-3.5.3插件(最完善的选择框插件 )

    非常适合高级选择框,可进行ajax,多选,单选等复杂操作

    HTML非常用标签 optgroup、sub、sup和bdo示例代码

    HTML标签之optgroup、sub、sup和bdo的用法与示例代码,需要的朋友可以参考下。

    select2-to-tree:Select2-to-Tree扩展了Select2以支持任意级别的嵌套。

    由于创建嵌套选项时Select2会退回到&lt;optgroup&gt;,因此仅支持单级嵌套。 不能保证任何其他级别的嵌套都无法在所有浏览器和设备上正确显示。 Select2-to-Tree扩展了Select2以支持任意级别的嵌套。 Select2兼容性 选择...

    HTML教程,认识optgroup元素

    select的分类选择,经测试IE和FF都能很好的支持该元素 &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"&gt;&lt;html xmln

    JavaScript 仿DropDownList控件 html下拉列框美化

    由于html的Select元素式样不更改,自已用Javascript写了DropDownList控件,支持分组.调用相当方便,不用更改原来的HTML结构.调用方法:DropDownList.bind(selectId).例如: --------------------------------- ...

    html option禁用选择 select禁用选项示例

    复制代码代码如下: &lt;select&gt; ””&gt;1&lt;/option&gt; ””&gt;2&lt;/option&gt; ””&gt;3&lt;/option&gt; ””&gt;4&lt;/option&gt; ””&gt;5&lt;/option&gt; &lt;... ””&gt;1&lt;/option&gt; ””&gt;2&lt;/option&gt; &lt;optgroup label=”3″&gt;&lt;/optgroup&gt;

    jQuery select下拉框单选和多选插件.zip

    $('[title="clickable_optgroup"]').addClass('chosen-container-optgroup-clickable'); }); $(document).on('click', '[title="clickable_optgroup"] .group-result', function() { var unselected = $...

    layui之select的option叠加问题的解决方法

    小编我在使用layui,在select的地方遇到了坑,select里的值居然无法清空,select里的option还有叠加问题,为了解决这个问题,也达到我的功能,我研究了下,让有同样需求的小伙伴不踩坑,特贴上我的源码: ...

    HTML+CSS常用代码

    HTML+CSS 常用代码大全 HTML(HyperText Markup Language)是一种标记语言,用来创建网页。它是网页的结构和内容的基础。HTML 由一系列的元素组成,每个...掌握这些标签和属性,你将能够创建更加复杂和有趣的网页。

    ajax multiselect

    ajax multiselect 多项选择框.转载请注明出处.

    Html5中文手册(程序员必备手册)

    19、&lt;col&gt; 定义表格列的属性。 20、&lt;colgroup&gt; 定义表格列的分组。 21、&lt;command&gt; 定义命令按钮。 22、&lt;datalist&gt; 定义下拉列表。 23、&lt;dd&gt; 定义定义的描述。 24、&lt;del&gt; 定义删除文本。 25、&lt;details&gt; 定义元素的...

    jQuery下拉框多选带检索代码.zip

    jQuery下拉框多选带检索代码是一款利用optgroup属性制作多级下拉菜单选择代码。

    jQuery带搜索功能下拉框多选代码

    jQuery带搜索功能下拉框多选代码,利用optgroup属性制作多级下拉菜单多项选择功能,还可以全选。

    IOS中safari下的select下拉菜单文字过长不换行的解决方法

    以上所述是小编给大家介绍的IOS中safari下的select下拉菜单文字过长不换行的解决方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对软件开发网网站的支持!

Global site tag (gtag.js) - Google Analytics