1.判断select选项中 是否存在Value="paraValue"的Item
2.向select选项中 加入一个Item
3.从select选项中 删除一个Item
4.修改select选项中 value="paraValue"的text为"paraText"
5.设置select中text="paraText"的第一个Item为选中
6.设置select中value="paraValue"的Item为选中
7.得到select的当前选中项的value
8.得到select的当前选中项的text
9.得到select的当前选中项的Index
10.清空select的项
-------------------------------------------
//1.判断select选项中 是否存在Value="paraValue"的Item
function jsSelectIsExitItem(objSelect,objItemValue)
{
var isExit = false;
for(var i=0;i<objSelect.options.length;i++)
{
if(objSelect.options[i].value == objItemValue)
{
isExit = true;
break;
}
}
return isExit;
}
//2.向select选项中 加入一个Item
function jsAddItemToSelect(objSelect,objItemText,objItemValue)
{
//判断是否存在
if(jsSelectIsExitItem(objSelect,objItemValue))
{
alert("该Item的Value值已经存在");
}
else
{
var varItem = new Option(objItemText,objItemValue);
// objSelect.options[objSelect.options.length] = varItem;
objSelect.options.add(varItem);
alert("成功加入");
}
}
//3.从select选项中 删除一个Item
function jsRemoveItemFromSelect(objSelect,objItemValue)
{
//判断是否存在
if(jsSelectIsExitItem(objSelect,objItemValue))
{
for(var i=0;i<objSelect.options.length;i++)
{
if(objSelect.options[i].value == objItemValue)
{
objSelect.options.remove(i);
break;
}
}
alert("成功删除");
}
else
{
alert("该select中 不存在该项");
}
}
//4.修改select选项中 value="paraValue"的text为"paraText"
function jsUpdateItemToSelect(objSelect,objItemText,objItemValue)
{
//判断是否存在
if(jsSelectIsExitItem(objSelect,objItemValue))
{
for(var i=0;i<objSelect.options.length;i++)
{
if(objSelect.options[i].value == objItemValue)
{
objSelect.options[i].text = objItemText;
break;
}
}
alert("成功修改");
}
else
{
alert("该select中 不存在该项");
}
}
//5.设置select中text="paraText"的第一个Item为选中
function jsSelectItemByValue(objSelect,objItemText)
{
//判断是否存在
var isExit = false;
for(var i=0;i<objSelect.options.length;i++)
{
if(objSelect.options[i].text == objItemText)
{
objSelect.options[i].selected = true;
isExit = true;
break;
}
}
//Show出结果
if(isExit)
{
alert("成功选中");
}
else
{
alert("该select中 不存在该项");
}
}
//6.设置select中value="paraValue"的Item为选中
//document.all.objSelect.value = objItemValue;
//7.得到select的当前选中项的value
//var currSelectValue = document.all.objSelect.value;
//8.得到select的当前选中项的text
//var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;
//9.得到select的当前选中项的Index
//var currSelectIndex = document.all.objSelect.selectedIndex;
//10.清空select的项
// document.all.objSelect.options.length = 0;
分享到:
相关推荐
本文将详细介绍如何使用JavaScript对`<select>`控件进行各种操作,包括新增选项、修改选项、删除选项、选中特定选项、清空所有选项以及判断某个值的选项是否存在。 ### 一、判断选项是否存在 使用以下函数可以检查...
以下是一些基本的方法,涵盖了从新增、修改、删除到选中和清空Select选项等常见需求: 1. **判断Select选项中是否存在指定Value的Item** 使用`jsSelectIsExitItem`函数,你可以检查给定的Value是否已经在Select中...
Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等
操作select控件是前端开发中常见的任务,包括但不限于新增选项、修改选项、删除选项、选中某个选项、清空选项以及判断某个特定值的选项是否存在等。以下是这些操作的知识点详细说明: 1. 判断select选项中是否存在...
js 操作 select 控件大全是 JavaScript 中对 select 控件的各种操作的集合,包括新增、修改、删除、选中、清空、判断存在等多种操作。下面将对这些操作进行详细的介绍和讲解。 一、 判断 select 选项中是否存在 ...
#### 标题:js 动态新增改变删除select的值 在网页开发中,`<select>`元素是非常常见的表单元素之一,用于提供下拉列表供用户选择。JavaScript 提供了丰富的 API 来操作 `<select>` 元素及其选项。本文将详细讲解...
本文将详细介绍如何使用JavaScript来操作这个控件,包括新增、删除、修改、选中和清空选项,以及判断特定选项是否存在的方法。 1. **判断select选项中是否存在指定Value的Item** ```javascript function ...
首先,通过`getElementById`获取到`<input type="file">`元素的引用,然后调用`select()`方法选中该输入框,接着使用`document.selection.clear()`清除当前的选择。这种方法基于浏览器的旧版选择和清除机制,其工作...
在Vue.js框架中,动态添加或删除对象和对象数组是常见的需求,特别是在处理表单数据、列表展示等场景。本文将详细讲解如何在Vue项目中实现这一功能。 首先,我们来看一下添加对象到对象数组的核心代码: ```...
**SelectPage**是一个适用于多种场景的下拉选择插件,它支持自定义事件、键盘快捷操作、分页浏览和多选标签展示等功能。其核心特性包括: - **自动化补全**:用户输入关键字时,插件能实时匹配并显示相关选项。 - *...
以上就是关于"107句JS常用语句"中提及的部分JavaScript基础知识,这些内容涵盖了数据类型、操作符、流程控制、DOM操作、函数定义以及与用户交互等多个方面,构成了JavaScript编程的基础。了解并熟练运用这些语句,将...
JavaScript(简称JS)是一种轻量级的脚本语言,广泛应用于网页和网络应用开发,能够对用户交互进行响应,处理动态内容。以下是一些JS学习的关键知识点: 1. 输出语句:`document.write("")` 用于在HTML文档中输出...
JavaScript,也被称为JS,是一种广泛应用于网页和网络应用开发的脚本语言,它主要负责实现客户端的交互功能。本文将全面介绍JavaScript中的基础概念、常用函数以及编程技巧。 1. 输出语句:`document.write("")` ...
JavaScript,简称JS,是一种广泛应用于Web开发的轻量级脚本语言,它的语法灵活且功能强大,能够直接在客户端运行,提升网页的交互性。在本文中,我们将深入探讨一些JavaScript中常用的关键句式和概念。 1. **输出...
在本文中,我们将探讨如何利用Bootstrap Table实现一些通用的功能,如时间控件、数据导出、动态下拉框、表单验证以及选中与获取信息的方法。 1. **单击单行选中** Bootstrap Table 提供了`click-row.bs.table`事件...
-Window的实例方法GetCloseReference等以及ActiveWindow的静态方法GetCloseReference等,其中的Close全部改为Hide。 -增加TabStrip中Tab控件可关闭属性EnableClose(默认为false)以及两个方法GetShowReference和...
-Window的实例方法GetCloseReference等以及ActiveWindow的静态方法GetCloseReference等,其中的Close全部改为Hide。 -增加TabStrip中Tab控件可关闭属性EnableClose(默认为false)以及两个方法GetShowReference和...