• select控件的操作方法,JS封装


    javascript封装,调用的话需要实例化,这个操作方法没有使用静态类了

    调用的时候,实例化,然后点对应的方法就可以了,传入对应的参数

    <script language="javascript" type="text/ecmascript">
            // 定义 CommonHtmlOperation.js 文件中的公共类
            var html_sel_op = new HtmlSelectOperation();        // 操作select控件
        </script>
    /// <summary>
    /// select 控件操作方式
    /// <summary>
    {
        function HtmlSelectOperation() {
    
            /// <summary>
            /// 获取select中选中的value
            /// <summary>
            this.GetSelectedValue = function (selId) {
                var selObj = document.getElementById(selId);
                var index = selObj.selectedIndex;
                return selObj.options[index].value;
            }
    
            /// <summary>
            /// 获取select中选中的text
            /// <summary>
            this.GetSelectedText = function (selId) {
                var selObj = document.getElementById(selId);
                var index = selObj.selectedIndex;
                return selObj.options[index].text;
            }
    
            /// <summary>
            /// 获取select中选中的index
            /// <summary>
            this.GetSelectedIndex = function (selId) {
                return document.getElementById(selId).selectedIndex;
            }
    
            /// <summary>
            /// 添加单个option
            /// <summary>
            this.AddOption = function (selId, text, value) {
                var selObj = document.getElementById(selId);
                if (selObj != null) {
                    if (text == null) { text = ""; }
                    if (value == null) { value = ""; }
                    selObj.options.add(new Option(text, value));
                }
            }
    
            /// <summary>
            /// 添加多个option
            /// <summary>
            this.AddOptions = function (selId, textArr, valueArr, isDelAll) {
                var selObj = document.getElementById(selId);
                if (selObj != null) {
    
                    // 根据传递的bool类型的isDelAll,判断在加载option之前是否需要清空原有项
                    if (isDelAll) {
                        selObj.options.length = 0;
                    }
    
                    if (textArr == null) { textArr = new Array(); }
                    if (valueArr == null) { valueArr = new Array(); }
    
                    // 加载option
                    for (var i = 0; i < textArr.length; i++) {
    
                        var selText = textArr[i];
                        var selValue = "";
    
                        // 检测两个数组中的项数是否能一一对应,若对应不上,则空值替代
                        if ((valueArr.length - 1) >= i) {
                            selValue = valueArr[i];
                        }
    
                        // 添加到页面
                        selObj.options.add(new Option(selText, selValue));
                    }
                }
            }
    
    
            /// <summary>
            /// 删除当前选中项
            /// <summary>
            this.DeleteSelected = function (selId) {
                var selObj = document.getElementById("selId");
                var index = selObj.selectedIndex;
                selObj.options.remove(index);
            }
    
            /// <summary>
            /// 删除当前选中项
            /// <summary>
            this.DeleteAllOption = function (selId) {
                var selObj = document.getElementById("selId");
                selObj.options.length = 0;
            }
    
        }
    }
  • 相关阅读:
    [转]relative、absolute和float
    CSS 布局属性(display,float,clear,visibility,overflow,overflow-x,overflow-y)
    CSS 块状元素和内联元素
    CSS定位
    CSS实例
    jQuery简单实例
    [转]几种常见SQL分页方式
    MyBatis Mapper XML 文件
    MyBatis XML 映射配置文件
    MyBatis 入门
  • 原文地址:https://www.cnblogs.com/loushuibazi/p/3877627.html
Copyright © 2020-2023  润新知