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

javascript option

阅读更多
一基础理解:

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 事件 IE 解决方案及兼容 IE 和 Firefox JavaScript 中的 Option onclick 事件是用户在Select 元素中选择一个选项时触发的事件,但是在 Internet Explorer(IE)浏览器中,该事件无法正确...

    option属性的js事件浏览器差异

    在JavaScript中,为`option`元素绑定事件通常使用`addEventListener`或`attachEvent`方法。`addEventListener`是W3C标准,适用于大多数现代浏览器,而`attachEvent`则是Internet Explorer (IE)特有的。因此,为了跨...

    c# javascript 操作 listBox控件

    在C#和JavaScript中,处理ListBox控件是构建交互式应用程序的重要环节。下面将详细介绍如何在C#和JavaScript中操作ListBox控件,并提供相关知识点。 **C#中的ListBox控件** 在C#中,ListBox主要应用于ASP.NET Web ...

    javascript_select_option_操作详解.txt

    ### JavaScript Select Option 操作详解 #### 一、检测是否有选中项 在处理表单时,经常需要检测用户是否已选择了某个 `&lt;select&gt;` 元素中的 `&lt;option&gt;` 项。以下是一个简单的示例来实现这一功能: ```javascript ...

    Javascript操作Select和Option

    Javascript操作Select和Option 一个网页 挺全的

    javascript 获取select ->option中id、value、label属性及中内容

    javascript 获取select -&gt;option中id、value、label属性及&lt;option&gt;&lt;/option&gt;中内容

    echarts 3D地图,地图区域点击触发事件

    ECharts是一款基于JavaScript的数据可视化库,它提供了丰富的图表类型和强大的交互功能,广泛应用于Web开发中的数据可视化场景。 首先,让我们理解ECharts 3D地图的基础。ECharts 3D地图是ECharts的一个特色功能,...

    以中国为中心Echart世界地图实例

    ECharts是一款基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图等,以及强大的地图功能。在这个“以中国为中心Echart世界地图实例”中,我们将探讨如何利用ECharts创建一个以中国为...

    echarts地图下钻省市区展示,js版

    Echarts是一款基于JavaScript的开源数据可视化库,它提供了丰富的图表类型和强大的交互功能,广泛应用于前端开发中。 首先,我们需要了解Echarts的基本用法。Echarts是基于ECMAScript标准的,因此对JavaScript的...

    JS事件OPTION事件触发

    JAVASCRIPT 实现OPTION的事件触发

    select option带自定义图片

    然而,原生的`&lt;option&gt;`元素并不支持直接添加图片,但通过一些JavaScript和CSS的技巧,我们可以实现自定义带有图片的`&lt;option&gt;`效果。以下是一个关于如何在`&lt;select&gt;`和`&lt;option&gt;`中添加自定义图片的详细教程。 ...

    echarts+ajax常见的图表

    ECharts是一款由百度开源的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图、旭日图等,并且支持动态数据加载和实时更新,非常适合用于Web应用中的数据展示。在本篇文章中,我们将...

    echarts中国地图城市区块选择代码

    ECharts是一款由百度开发的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图、散点图等,并且支持地图图表,包括中国地图。在ECharts中,实现中国地图城市区块选择功能,可以让用户...

    echartsmapgeo跟随缩放移动.pdf

    ECharts是一款优秀的开源JavaScript数据可视化库,它提供了丰富的图表类型,能够帮助开发者轻松实现各种复杂的数据展示。在ECharts中,地图(Map)是一个重要的组成部分,可以用于展示地理分布数据。本文将深入探讨...

    echarts全国、省及市的json地图

    ECharts是一款由百度开源的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,如柱状图、折线图、饼图、散点图等,并且支持在网页上自由地组合和交互。在处理地理数据或者需要展示地理位置信息时,ECharts...

    echarts实例

    ECharts是一款由百度开源的,基于JavaScript的数据可视化库,它提供了丰富的图表类型,精美的图表效果,便捷的配置项和API,以及强大的交互性。在本实例中,我们将深入探讨如何利用ECharts来创建折线图、饼状图和...

    最简单的echars使用 河北地图

    ECharts 是一个由百度开发的开源 JavaScript 数据可视化库,它提供了丰富的图表类型,适用于各种数据可视化场景。在“最简单的ECharts使用 河北地图”这个主题中,我们将探讨如何利用ECharts来展示河北地图,并实现...

    echarts柱状图

    例如,你可以使用JavaScript的`fetch`或`XMLHttpRequest`方法获取服务器数据,然后将返回的数据赋值给`option`,再调用`echarts.init`的实例的`setOption`方法刷新图表: ```javascript fetch('your/data/source') ...

    vue实现多个玫瑰图的写法 grid布局 实现模拟切换参数

    updateOption(newOption) { this.myChart.setOption(newOption); } } }; ``` 2. **Rose Chart配置**: 在`option`对象中,定义玫瑰图的配置,如数据、系列、极坐标系等。你可以根据需求创建多个玫瑰图,通过...

Global site tag (gtag.js) - Google Analytics