<html>
<head>
<script language="javascript">
var infoMap = new Object() ;
function number(){
var obj = document.getElementById("mySelect");
//obj.options[obj.selectedIndex] = new Option("我的吃吃","4");
//在当前选中的那个的值中改变
//obj.options.style.cssText =("background:red");
obj.options.add(new Option("我的吃吃","4"));//再添加一个option
//alert(obj.length);
obj.options[obj.length-1].style.cssText =("background:#66FF33");
/*
for (var i = 0; i < obj.length; i++) {
obj.options.add(new Option(obj[i], obj[i]));
}
*/
//alert(obj.selectedIndex);//显示序号，option自己设置的
/*
var name = obj.options[obj.selectedIndex].text;
infoMap[name+'-1'] = {
name : name,
age : '1'
};
if( infoMap[name+'-1'] ) {
var oldname = infoMap[name+'-1'].name;
infoMap[name+'-1'].name = oldname+','+name;
}
alert(infoMap[name+'-1'].age);
*/
//obj.options[obj.selectedIndex].text = "我的吃吃";更改值
//obj.remove(obj.selectedIndex);//删除功能
}
</script>
</head>
<body>
<select id="mySelect" multiple>
<option title='hello' selected>我的包包</option>
<option style="background:red" value="#333333">我的本本</option>
<option>我的油油</option>
<option>我的担子</option>
</select>
</p>
<p style="color:#fff;background:#780e1a;">Test for set style.</p>
<p><button onclick="document.getElementsByTagName('p')[0].style='color:#000;background:#eee;'">set style(op only)</button></p>
<p><button onclick="document.getElementsByTagName('p')[0].style.cssText='background:red;'">set style(ff & ie)</button></p>
<p><button onclick="document.getElementsByTagName('p')[0].setAttribute('style','color:#000;background:#eee;')">set style(ff & op)</button></p>
<p><button onclick="document.getElementsByTagName('p')[0].getAttribute('style').setAttribute('cssText','color:#000;background:#eee;')">set style(ie only)</button></p>
<p>
<input type="button" name="button" value="查看结果" onclick="number();">
</body>
</html>
分享到：
相关推荐
用js操作select的option，可以增加删除和判断value值是否在下拉列表存在
在JavaScript（JS）编程中，动态添加Select中的Option元素值是一项常见的需求，特别是在网页交互或者数据填充时。这里我们将深入探讨如何实现这个功能，并提供一个实际的案例来演示这一过程。 首先，我们要理解HTML...
<title>JS 操作 Select 和 Option <script language="JavaScript"> function $(id) { return document.getElementById(id); } function show() { var selectObj = $("area"); var myOption = document....
在JavaScript中，我们可以通过DOM操作来创建和添加`option`元素。首先，我们需要一个数组来存储下拉列表的数据，这些数据可以是字符串，也可以是对象，取决于我们的具体需求。 以下是一个基本的步骤： 1. **准备...
Javascript操作Select和Option 一个网页 挺全的
javascript 获取select ->option中id、value、label属性及<option></option>中内容
### JavaScript Select Option 操作详解 #### 一、检测是否有选中项 在处理表单时，经常需要检测用户是否已选择了某个 `<select>` 元素中的 `<option>` 项。以下是一个简单的示例来实现这一功能： ```javascript ...
在JavaScript编程中，`select`元素和`option`标签是创建下拉列表的重要部分。`select`用于定义一个选择框，而`option`则用于在选择框中添加可选项。在网页交互中，用户通常会使用这样的下拉列表来从预设的选项中做出...
总结来说，要实现`<select>`和`<option>`带有自定义图片的效果，我们需要结合HTML的`data-*`属性，JavaScript的动态操作和CSS的样式设计。这不仅增强了用户体验，也展示了前端技术在实现视觉效果方面的灵活性。在...
### jQuery 操作 Select Option 整理 #### 一、引言 在Web开发中，`<select>`元素作为用户交互的重要部分，常用于提供一系列选项供用户选择。jQuery作为一种流行的JavaScript库，极大地简化了DOM操作的过程，使得...
在JavaScript中，为`option`元素绑定事件通常使用`addEventListener`或`attachEvent`方法。`addEventListener`是W3C标准，适用于大多数现代浏览器，而`attachEvent`则是Internet Explorer (IE)特有的。因此，为了跨...
在本案例中，`<option>`元素就是DOM的一部分，我们可以通过JavaScript的DOM操作方法来对其进行动态管理。 首先，创建一个新的`<option>`元素需要使用`document.createElement('option')`。然后，可以使用`....
示例代码中在HTML的head部分通过script标签引入了外部的jQuery脚本库，路径是"../../../../js/common/jquery-1.6.2.js"。这是使用jQuery功能的前提条件。 2. 使用jQuery获取选中的option的文本（text）： - 方法一...
在"jQuery操作两个select上、下、左、右移动select option演示源码"中，我们可以推测这段代码实现了以下功能： 1. **选择项的移动**：用户可以通过上、下、左、右键或者相应的UI交互，来改变`option`元素在`select`...
本文实例讲述了JS实现select选中option触发事件操作。分享给大家供大家参考，具体如下： 我们在用到下拉列表框select时，需要对选中的<option>选项触发事件，其实<option>本身没有触发事件方法，我们只有在select里...
在JavaScript中，这可以通过操作DOM（文档对象模型）来实现。本文将详细介绍如何使用JavaScript将指定的`<option>`设置为默认选中。 首先，我们需要了解`<select>`和`<option>`的基本用法。`<select>`元素包含一个...
本文详细介绍了如何使用JavaScript更改select元素内option的属性，包括更改选项文本、值等，并提供了一个实例来演示具体操作。 首先，要更改select内的option属性，需要获取select元素的DOM引用。这通常通过...
使用jQuery可以方便地创建并添加新的`<option>`元素到下拉列表中。 2. **清空下拉列表的所有选项**： ```javascript $("#sel").empty(); ``` 使用`.empty()`方法可以清空下拉列表的所有选项。 以上就是从给定...
根据给定的文件标题、描述、标签以及部分内容，本文将深入解析HTML中使用JavaScript操作`<select>`下拉框的全面方法。`<select>`元素是网页表单中用于创建下拉列表的关键部分，而通过JavaScript，我们可以动态地添加...