一基础理解:
var e = document.getElementById("selectId");
e. options = new Option("文本","值") ;
//创建一个option对象,即在<select >标签中创建一个或多个<option value="值">文本</option>
//options 是个数组,里面可以存放多个<option value="值">文本</option>这样的标签
1:options [ ]数组的属性:
length属性---------长度属性
selectedIndex属性--------当前被选中的框中的文本的索引值,此索引值是内存自动分配的(0,1,2,3.....)对应(第一个文本值,第二个文本值,第三个文本值,第四个文本值..........)
2:单个option的属性(---obj.options [obj.selecedIndex]是指定的某个<option>标签,是一个---)
text属性---------返回/指定 文本
value属性------返回/指定 值,与<options value="...">一致。
index属性-------返回下标,
selected 属性-------返回/指定该对象是否被选中.通过指定 true 或者 false,可以动态的改变选中项
defaultSelected 属性-----返回该对象默认是否被选中。true / false。
3:option的方法
增加一个<option>标签-----obj.options .add (new("文本","值"));<增>
删除一个<option>标签-----obj.options .remove(obj.selectedIndex)<删>
获得一个<option>标签的文本-----obj.options [obj.selectedIndex].text<查>
修改一个<option>标签的值-----obj.options [obj.selectedIndex]=new Option("新文本","新值")<改>
删除所有<option>标签-----obj.options .length = 0
获得一个<option>标签的值-----obj.options [obj.selectedIndex].value
注意:
a:上面的写的是如这样类型的方法obj.options .function()而不写obj.funciton,是因为为了考虑在IE和FF 下的兼容,如obj.add ()只能在IE中有效.
b:obj.option中的option不需要大写,new Option中的Option需要大写
二 应用
<html>
<head>
<script language="javascript">
function number(){
var obj = document.getElementById("mySelect");
//obj.options [obj.selectedIndex] = new Option("我的吃吃","4");//在当前选中的那个的值中改变
//obj.options .add (new Option("我的吃吃","4"));再添加一个option
//alert(obj.selectedIndex);//显示序号,option自己设置的
//obj.options [obj.selectedIndex].text = "我的吃吃";更改值
//obj.remove(obj.selectedIndex);删除功能
}
</script>
</head>
<body>
<select id="mySelect">
<option>我的包包</option>
<option>我的本本</option>
<option>我的油油</option>
<option>我的担子</option>
</select >
<input type="button" name="button" value="查看结果" onclick="number();">
</body>
</html>
分享到:
相关推荐
JavaScript Option onclick 事件 IE 解决方案及兼容 IE 和 Firefox JavaScript 中的 Option onclick 事件是用户在Select 元素中选择一个选项时触发的事件,但是在 Internet Explorer(IE)浏览器中,该事件无法正确...
在JavaScript中,为`option`元素绑定事件通常使用`addEventListener`或`attachEvent`方法。`addEventListener`是W3C标准,适用于大多数现代浏览器,而`attachEvent`则是Internet Explorer (IE)特有的。因此,为了跨...
在C#和JavaScript中,处理ListBox控件是构建交互式应用程序的重要环节。下面将详细介绍如何在C#和JavaScript中操作ListBox控件,并提供相关知识点。 **C#中的ListBox控件** 在C#中,ListBox主要应用于ASP.NET Web ...
### JavaScript Select Option 操作详解 #### 一、检测是否有选中项 在处理表单时,经常需要检测用户是否已选择了某个 `<select>` 元素中的 `<option>` 项。以下是一个简单的示例来实现这一功能: ```javascript ...
Javascript操作Select和Option 一个网页 挺全的
javascript 获取select ->option中id、value、label属性及<option></option>中内容
ECharts是一款基于JavaScript的数据可视化库,它提供了丰富的图表类型和强大的交互功能,广泛应用于Web开发中的数据可视化场景。 首先,让我们理解ECharts 3D地图的基础。ECharts 3D地图是ECharts的一个特色功能,...
ECharts是一款基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图等,以及强大的地图功能。在这个“以中国为中心Echart世界地图实例”中,我们将探讨如何利用ECharts创建一个以中国为...
Echarts是一款基于JavaScript的开源数据可视化库,它提供了丰富的图表类型和强大的交互功能,广泛应用于前端开发中。 首先,我们需要了解Echarts的基本用法。Echarts是基于ECMAScript标准的,因此对JavaScript的...
JAVASCRIPT 实现OPTION的事件触发
然而,原生的`<option>`元素并不支持直接添加图片,但通过一些JavaScript和CSS的技巧,我们可以实现自定义带有图片的`<option>`效果。以下是一个关于如何在`<select>`和`<option>`中添加自定义图片的详细教程。 ...
ECharts是一款由百度开源的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图、旭日图等,并且支持动态数据加载和实时更新,非常适合用于Web应用中的数据展示。在本篇文章中,我们将...
ECharts是一款由百度开发的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图、散点图等,并且支持地图图表,包括中国地图。在ECharts中,实现中国地图城市区块选择功能,可以让用户...
ECharts是一款优秀的开源JavaScript数据可视化库,它提供了丰富的图表类型,能够帮助开发者轻松实现各种复杂的数据展示。在ECharts中,地图(Map)是一个重要的组成部分,可以用于展示地理分布数据。本文将深入探讨...
ECharts是一款由百度开源的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图、散点图等,并且支持在网页上自由地组合和交互。在处理地理数据或者需要展示地理位置信息时,ECharts...
ECharts是一款由百度开源的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,精美的图表效果,便捷的配置项和API,以及强大的交互性。在本实例中,我们将深入探讨如何利用ECharts来创建折线图、饼状图和...
ECharts 是一个由百度开发的开源 JavaScript 数据可视化库,它提供了丰富的图表类型,适用于各种数据可视化场景。在“最简单的ECharts使用 河北地图”这个主题中,我们将探讨如何利用ECharts来展示河北地图,并实现...
例如,你可以使用JavaScript的`fetch`或`XMLHttpRequest`方法获取服务器数据,然后将返回的数据赋值给`option`,再调用`echarts.init`的实例的`setOption`方法刷新图表: ```javascript fetch('your/data/source') ...
updateOption(newOption) { this.myChart.setOption(newOption); } } }; ``` 2. **Rose Chart配置**: 在`option`对象中,定义玫瑰图的配置,如数据、系列、极坐标系等。你可以根据需求创建多个玫瑰图,通过...