Javascript操作DropDownList控件总结 (2)

document.getElementById('ddlCities').options.length = 0;
 

 (2) 判断DropDownList中是否有value为'objItemValue'的ListItem。
 

代码
function isListItemExistByValue(objDdl, objItemValue)
{
    var isExist = false;
    for(var i in objDdl.options)
　　 {
　　　　if(i.value == objItemValue)
　　　　{
　　　　　　isExist = true;
　　　　　　break;
　　　　}
　　}
　　return isExist;
}
 

 

--------------------------------------------------------------------------------

(3) 判断DropDownList中是否有text为'objItemText'的ListItem。（采用了另一种for循环）

--------------------------------------------------------------------------------

 

代码
function isListItemExistByText(objDdl, objItemText)
{
    var isExist = false;
    for (var i = 0; i < objDdl.options.length; i++) {
        if (objDdl.options[i].text == objItemText) {
            isExist = true;
            break;
        }
    }
　　return isExist;
}
 

 

--------------------------------------------------------------------------------

(4) 向objDdl添加一个item，其中value为paramValue，text为paramText

--------------------------------------------------------------------------------

 代码

--------------------------------------------------------------------------------

(5) objDdl删除一个item，其中参数为value的值为paramValue

--------------------------------------------------------------------------------

 代码

--------------------------------------------------------------------------------

(6) objDdl删除多个item，其中参数为text的值为paramText

--------------------------------------------------------------------------------

 代码

--------------------------------------------------------------------------------
(7) objDdl删除当前选中项

--------------------------------------------------------------------------------

function removeSelectedListItem(objDdl)
{
    objDdl.options[objDdl.selectedIndex] = null;
}
 

 (8) 修改objDdl选项中value = "paramValue"的text为"paramText"

--------------------------------------------------------------------------------

代码
//修改objDdl选项中value = "paramValue"的text为"paramText"
function changeItemText(objDdl , paramValue , paramText)
{
    if (isExistItemByValue(objDdl, paramValue))
    {
        for(var i= 0 ; i< objDdl.options.length ; i++)
        {
            if(objDdl.options[i].value == paramValue)
            {
                objDdl.options[i].text = paramText;
                break;
            }
        }
    }
    else
    {
        alert('更新失败，不存在该项：' + paramValue);
    }
}
 

 (9) 设置objDdl中text为"paramText"的第一个Item为选中

--------------------------------------------------------------------------------

代码
//设置objDdl中text为"paramText"的第一个Item为选中
function setSelectedItemByText(objDdl , paramText)
{
    //判断是否存在
    var isExist = false;
    for (var i = 0; i < objDdl.options.length; i++) {
        if (objDdl.options[i].text == paramText) {
            objDdl.options[i].selected = true;
            isExist = true;
            break;
        }
    }
   
    //显示出来结果
    if(!isExist)
    {
        alert('选择失败，不存在该项：' + paramText)
    }
}
 

 (10) 得到当前的选中项的value

--------------------------------------------------------------------------------

//得到当前的选中项的值value
function getSelectedValue(objDdl) {
    return objDdl.value;
}
 

 (11) 得到当前的选中项的text

--------------------------------------------------------------------------------

//得到当前的选中项的值text
function getSelectedText(objDdl) {
    return objDdl.options[objDdl.selectedIndex].text;
}
 

 (12) 设置objDdl中value = "paramValue"的item为选中

--------------------------------------------------------------------------------

//设置objDdl中value = "paramValue"的item为选中
function setSelectedItemByValue(objDdl, paramValue) {
    objDdl.value = paramValue;
}
 

 (13) 得到当前选中项的Index

--------------------------------------------------------------------------------

//得到当前选中项的Index
function getCurrSelectedIndex(objDdl) {
    return objDdl.selectedIndex;
}

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------

--------------------------------------------------------------------------------

 

看这里，上面的代码写的比较凌乱，这里我把这些方法封装成一个对象，以后直接调用就可以了。

--------------------------------------------------------------------------------

 var ddlHandler = {};

//清空objDdl中的所有项
ddlHandler.truncate = function(objDdl) {
    objDdl.options.length = 0;
}

//判断objDdl中是否存在value为paramValue的项(ListItem)
ddlHandler.isExistItemByValue = function(objDdl, paramValue)
{
    var isExist = false;

    for (var i = 0; i < objDdl.options.length; i++) {
        if (objDdl.options[i].value == paramValue) {
            isExist = true;
            break;
        }
    }
   
    return isExist;
}

//判断objDdl中是否存在text为paramValue的项(ListItem)
ddlHandler.isExistItemByText = function(objDdl, paramText) {
    var isExist = false;

    for (var i = 0; i < objDdl.options.length; i++) {
        if (objDdl.options[i].text == paramText) {
            isExist = true;
            break;
        }
    }

    return isExist;
}

//向objDdl添加一个item，其中value为paramValue，text为paramText
ddlHandler.addListItem = function(objDdl , paramValue , paramText)
{
    //首先判断是否已存在paramValue的项
    if(this.isExistItemByValue(objDdl,paramValue))
    {
        alert('添加失败，不能添加重复项：' + paramValue);
    }
    else
    {
        var varItem = new Option(paramText,paramValue);
        objDdl.options.add(varItem);
    }
}

//向objDdl删除一个item，其中参数为value的值为paramValue
ddlHandler.removeListItemByValue = function(objDdl , paramValue)
{
    //首先判断是否存在该项，存在才删除
    if (!this.isExistItemByValue(objDdl, paramValue))
    {
        alert('删除失败，因为不存在该项：' + paramValue);
    }
    else
    {
        for(var i = 0 ; i< objDdl.options.length ; i++)
        {
            if(objDdl.options[i].value == paramValue)
            {
                objDdl.options.remove(i);
                break;
            }
        }
    }
}

//向objDdl删除找到的item，其中参数为text的值为paramText
ddlHandler.removeListItemByText = function(objDdl, paramText) {
    //首先判断是否存在该项，存在才删除
    if (!this.isExistItemByText(objDdl, paramText)) {
        alert('删除失败，因为不存在该项：' + paramText);
    }
    else {
        for (var i = 0; i < objDdl.options.length; i++) {
            if (objDdl.options[i].text == paramText) {
                objDdl.options.remove(i);
            }
        }
    }
}

//删除objDdl当前选中的项
ddlHandler.removeSelectedListItem = function(objDdl)
{
    objDdl.options[objDdl.selectedIndex] = null;
}

//修改objDdl选项中value = "paramValue"的text为"paramText"
ddlHandler.changeItemText = function(objDdl , paramValue , paramText)
{
    if (this.isExistItemByValue(objDdl, paramValue))
    {
        for(var i= 0 ; i< objDdl.options.length ; i++)
        {
            if(objDdl.options[i].value == paramValue)
            {
                objDdl.options[i].text = paramText;
                break;
            }
        }
    }
    else
    {
        alert('更新失败，不存在该项：' + paramValue);
    }
}

//设置objDdl中text为"paramText"的第一个Item为选中
ddlHandler.setSelectedItemByText = function(objDdl , paramText)
{
    //判断是否存在
    var isExist = false;
    for (var i = 0; i < objDdl.options.length; i++) {
        if (objDdl.options[i].text == paramText) {
            objDdl.options[i].selected = true;
            isExist = true;
            break;
        }
    }
   
    //显示出来结果
    if(!isExist)
    {
        alert('选择失败，不存在该项：' + paramText)
    }
}

//得到当前的选中项的值value
ddlHandler.getSelectedValue = function(objDdl) {
    return objDdl.value;
}

//得到当前的选中项的值text
ddlHandler.getSelectedText = function(objDdl) {
    return objDdl.options[objDdl.selectedIndex].text;
}

//设置objDdl中value = "paramValue"的item为选中
ddlHandler.setSelectedItemByValue = function(objDdl, paramValue) {
    objDdl.value = paramValue;
}

//得到当前选中项的Index
ddlHandler.getCurrSelectedIndex = function(objDdl) {
    return objDdl.selectedIndex;
}