1判断select选项中 是否存在Value="paraValue"的Item 
2向select选项中 加入一个Item 
3从select选项中 删除一个Item 
4删除select中选中的项 
5修改select选项中 value="paraValue"的text为"paraText" 
6设置select中text="paraText"的第一个Item为选中 
7设置select中value="paraValue"的Item为选中 
8得到select的当前选中项的value 
9得到select的当前选中项的text 
10得到select的当前选中项的Index 
11清空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;

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

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

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

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

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

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

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

  4. Jquery获取select 控件的change事件时选中的值

    HTML代码如下: <div class="col-sm-9 col-xs-12"> <select id="groupid" class=& ...

  5. JavaScript封装一个实用的select控件

    最近一直把精力放在项目上面,导致忽略的一些底层的东西.以前就一直觉得原有的select控件很丑,正好周末有时间,试着做了一个简单封装,实现了它的基本功能.我总结了一下,大概分为三个部分: 1.对显示样 ...

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

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

  7. 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 ...

  8. Jquery 操作Html 控件 CheckBox、Radio、Select 控件

    在使用 Javascript 编写前台脚本的时候,经常会操作 Html 控件,比如 checkbox.radio.select,用 Jquery 库操作其他会方便很多,下面用Jq对这些控件的操作进行一 ...

  9. html select控件的jq操作

    html select控件的jq操作 1.判断select选项中 是否存在Value="paraValue"的Item $("#selectid option[@valu ...

随机推荐

  1. verilog之task用法实例

    该用法的代码源自夏宇闻老师的教材. 源代码: module traffic_lights; reg clock, red, amber, green; , off = , red_tics = , a ...

  2. Have trouble in your life

    当你烦恼的时候不知道如何是好时,你可以下载此程序,可以帮助你化解烦恼! 下载地址: http://pan.baidu.com/s/1i3FtxHF

  3. jsp页面可以巧用模态框

    jsp页面使用模态框配合ajax出来的效果真的没话说,当然你也可以使用模态框配合action,但是在删除和更新的时候传值有点麻烦,用ajax 就没有这些问题 ,比如删除代码的时候在js文件中传值可以这 ...

  4. JS 点击事件失效

    有时候,会发现js失效 ,代码如果是如下的时候 <input type="button" onclick="change()"value="変更 ...

  5. 佛祖保佑 永无BUG(网转 by atkfc)

        //                   _ooOoo_    //                  o8888888o    //                  88" . ...

  6. 解决 SQLSERVER 2008 无法删除作业

    SQLSERVER 2008 中删除作业时遇到无法删除 解决办法: USE [msdb] ) SET @job_name = N'JobName' --注:jobName为维护计划对应的jobName ...

  7. EXPDP IMPDP 知识总结

    Data Pump Export ATTACH Default: job currently in the user's schema, if there is only one Purpose(目的 ...

  8. XMLHelper 类

     这个XMLHelper类中包括了XML文档的创建,文档节点和属性的读取,添加,修改,删除的方法功能的实现,有兴趣的朋友,可以进来看看,所有代码都在WebForm和WinForm中调试通过. 这是下面 ...

  9. 关于idea激活

    1.在线激活 https://www.iteblog.com/idea/ 使用可访问:http://idea.iteblog.com/   或者  http://idea.lanyus.com/ ht ...

  10. java学习——IO流

    字符流的由来:其实就是:字节流读取文字字节数据后,不直接操作而是先查指定的编码表.获取对应的文字.在对这个文字进行操作.简单说:字节流+编码表 ---------------------------- ...