原文:js操作select控件大全(包含新增、修改、删除、选中、清空、判断存在等)

js操作select控件大全(包含新增、修改、删除、选中、清空、判断存在等)

js 代码
// 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.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中选中的项   
function jsRemoveSelectedItemFromSelect(objSelect) {       
    var length = objSelect.options.length - 1;   
    for(var i = length; i >= 0; i--){   
        if(objSelect[i].selected == true){   
            objSelect.options[i] = null;   
        }   
    }   
}     
  
// 5.修改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中 不存在该项");       
    }       
}       
  
// 6.设置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中 不存在该项");       
    }       
}       
  
// 7.设置select中value="paraValue"的Item为选中   
document.all.objSelect.value = objItemValue;   
      
// 8.得到select的当前选中项的value   
var currSelectValue = document.all.objSelect.value;   
      
// 9.得到select的当前选中项的text   
var currSelectText = document.all.objSelect.options[document.all.objSelect.selectedIndex].text;   
      
// 10.得到select的当前选中项的Index   
var currSelectIndex = document.all.objSelect.selectedIndex;   
      
// 11.清空select的项   
document.all.objSelect.options.length = 0;

js操作select控件大全(包含新增、修改、删除、选中、清空、判断存在等)的更多相关文章

  1. 转 JavaScript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等)

    收藏一下 1.判断select选项中 是否存在Value=”paraValue”的Item2.向select选项中 加入一个Item3.从select选项中 删除一个Item4.删除select中选中 ...

  2. Javascript 操作select控件大全(新增、修改、删除、选中、清空、判断存在等)

    1判断select选项中 是否存在Value="paraValue"的Item 2向select选项中 加入一个Item 3从select选项中 删除一个Item 4删除selec ...

  3. selenium webdriver——JS操作日历控件

    一般的日期控件都是input标签下弹出来的,如果使用webdriver 去设置日期, 1. 定位到该input 2. 使用sendKeys 方法 比如 但是,有的日期控件是readonly的 比如12 ...

  4. jQuery操作select控件取值和设值

    1.级联select的操作,后一个select的值随着前一个select选中值变化 $(".select_A").change(function(){ $(".selec ...

  5. JS操作select下拉框动态变动(创建/删除/获取)

    1.动态创建select function createSelect(){ var mySelect = document.createElement_x("select"); m ...

  6. SELECT控件操作的JS代码示例

    SELECT控件操作的JS代码示例 1 检测是否有选中 if(objSelect.selectedIndex > -1) { //说明选中 } else { //说明没有选中 } 2.动态创建s ...

  7. [WinForm]WinForm跨线程UI操作常用控件类大全

    前言 在C#开发的WinForm窗体程序开发的时候,经常会使用多线程处理一些比较耗时之类的操作.不过会有一个问题:就是涉及到跨线程操作UI元素. 相信才开始接触的人一定会遇上这个问题. 为了解决这个问 ...

  8. Jquery 操作Html 控件 CheckBox、Radio、Select 控件 【转】http://www.cnblogs.com/lxblog/archive/2013/01/09/2853056.html

    Jquery 操作Html 控件 CheckBox.Radio.Select 控件   在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio ...

  9. Js操作Select大全(取值、设置选中)

    Js操作Select是很常见的,也是比较实用的. jquery操作select(取值,设置选中) 每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<s ...

随机推荐

  1. [.NET Core 24]把project.json迁移到.csproj

    链接:https://blog.jetbrains.com/dotnet/2017/04/04/rider-eap-update-csproj-based-net-core-support-migra ...

  2. Js之全局函数

    全局函数 encodeURI()decodeURI()encodeURIComponent()decodeURIComponent()escape()unescape()eval() String() ...

  3. quick cocos2dx lua 网络图片 下载 自己主动更新

    转载请注明,原文地址:http://blog.csdn.net/dd135373/article/details/46468505 quick coocs2d-x 网络图片下载,自己主动更新纹理,保存 ...

  4. 一:redis 的string类型 - 相关操作

    *redisclient使用: =============一类:string的方法================ 介绍:string是redis的最简单类型,一个key相应一个value,strin ...

  5. 百度2014 Summer Party视频集锦

    博客已经迁移到reetsee.com,在百度或其他搜索引擎搜"吹水小镇"就能够了.要看原版的博客请到:blog.reetsee.com 转载请注明: 吹水小镇 | reetsee. ...

  6. TextView和EditText中添加图片(ImageSpan)

    编辑框中加图片,以前一直以为很复杂,后来发现android有些类已经很好的实现了这些功能. 代码如下: [java] view plaincopy mSubjectDetailView = (Text ...

  7. Android 混淆[学习笔记]

    Android 混淆 Gradle的简介: http://www.flysnow.org/2015/03/30/manage-your-android-project-with-gradle.html ...

  8. [UWP开发]NavigationView基础使用方法

    原文:[UWP开发]NavigationView基础使用方法 [UWP开发]NavigationView基础使用方法 NavigationView是秋季创意者更新(16299)引入的新控件,用于生成W ...

  9. P和P1指向了O和O1两个变量(对象)的地址, 而不是O和O1的内容(对象的实际地址)——充分证明@是取变量(对象)的地址,而不是变量里面的内容,够清楚!

    如图,为什么这样取出来的p,p1的值不一样呢?   165232328群友庾伟洪告诉我:  P和P1指向了O和O1两个变量(对象)的地址, 而不是O和O1的内容(对象的实际地址) ,你想P指向真正的对 ...

  10. mac在下面Apache 创 .htaccess档

    在设定一个固定的链接将提下面的例子说明样题: 若您的 .htaccess 文件可写.我们能够自己主动改动它.但似乎它不可写,因此我们在下方列出了您 .htaccess 文件里应该增加的URL 重写规则 ...