zoukankan      html  css  js  c++  java
  • select options常用操作

    1.判断select选项中 是否存在Value="value"的option元素 

    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 addOptions(objsel,text,value){ 

    if (valueExit(objsel,value)) {
    alert("改属性值已经存在");
    };
    var option = new Option(text,value);
    objsel.add(option,null);
    alert('添加成功'); 

    }

    3.从select选项中 删除一个Item

    function removeOpt(objSelect,objItemValue)
    {
    //判断是否存在
    if(valueExit(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" 

    <script type="text/javascript">
        var select = document.getElementById('sele');
    function chaTeByval(objSelect,objItemText,objItemValue)
    {
         //判断是否存在
         if(isExit(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中 不存在该项");
         }
    } 
    
    chaTeByval(select,'美国',6);

    5.设置select中text="paraText"的第一个Item为选中

    <script type="text/javascript">
        var select = document.getElementById('sele');
    function selbyText(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;
             }
         }     
         if(isExit)
         { 
             alert("成功选中");          
    
         }
         else
         {
             alert("该select中 不存在该项");
         } 
    }
    
    selbyText(select,'上海');
    </script>

     6.设置select中value="paraValue"的Item为选中

    <script type="text/javascript">
        var select = document.getElementById('sele');
    function selbyText(objSelect,objItemValue)
    {  
         //判断是否存在
         var isExit = false;
         for(var i=0;i<objSelect.options.length;i++)
         {
             if(objSelect.options[i].value == objItemValue)
             {
                 objSelect.options[i].selected = true;
                 isExit = true;
                 break;
             }
         }     
         if(isExit)
         { 
             alert("成功选中");          
    
         }
         else
         {
             alert("该select中 不存在该项");
         } 
    }
    
    selbyText(select,1);
    </script>

    7.得到select的当前选中项的value       select.options[select.options.selectedIndex].value

    8.得到select的当前选中项的text      select.options[select.options.selectedIndex].text

    9.得到select的当前选中项的Index    select.options.selectedIndex;

    10.清空select的项           select.options.length=0   select.innerHTML="";

     

  • 相关阅读:
    Redis入门--- 五大数据类型 ---String ,List
    Redis入门 --- 安装
    Netty 应用实例-群聊系统,心跳检测机制案例 ,WebSocket 编程实现服务器和客户端长连接
    红锁的实现
    基于Redis实现分布式锁
    基于分布式锁 分布式全局唯一ID
    Netty Java BIO 编程 (一)
    Netty Java NIO 基本介绍Channel 和 buffer (二)
    Java AIO 基本介绍
    SpringBoot 系列教程自动配置选择生效
  • 原文地址:https://www.cnblogs.com/jiechn/p/4120953.html
Copyright © 2011-2022 走看看