zoukankan      html  css  js  c++  java
  • JS操作select相关方法:新增 修改 删除 选中 清空 判断存在 等

    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;

  • 相关阅读:
    HDUOJ--4565 So Easy!
    简单的java实验,涉及到 类继承以及接口问题,方法体的重写(区别于重载)
    java 快速求素数
    狄斯奎诺(dijkstra 模板)
    2014 蓝桥杯 阶梯报告(含代码 详细讲解)
    HDUOJ---汉洛塔IX
    小错误系列
    HDUOJ-----4510 小Q系列故事——为什么时光不能倒流
    HDUOJ----4509湫湫系列故事——减肥记II
    HDUOJ-----4506小明系列故事——师兄帮帮忙
  • 原文地址:https://www.cnblogs.com/freeliver54/p/645983.html
Copyright © 2011-2022 走看看