js下拉框里超过变成省略号


答案：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 

<html xmlns="http://www.w3.org/1999/xhtml"> 

<head> 

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

<title>脚本之家 www.zhaoxi.net js下拉框省略号</title> 

</head> 

<body> 

    <select id="a"> 

        <option slected="slected">下拉框里的字太多了，下拉框会变长，然后把版面挤乱了，多余的如何显示成省略号？</option> 

        <option>或者限制住下拉框的跨度也行？</option> 

        <option>style="width:100px;"</option> 

        <option>这种已经试过了，没用！/option> 

    </select> 

    <script type="text/javascript"> 

        function cutOption(selectObj , length) { 

            this.selectObj = selectObj; 

            this.length = length; 

        } 

        cutOption.prototype.init = function() { 

            this.options = this.selectObj.getElementsByTagName('option'); 

            for(i=0 , j=this.options.length ; i<j ; i++ ) 

            { 

                text = this.options[i].firstChild.nodeValue; 

                if(text.length<=this.length) 

                { 

                    return; 

                } 

                else { 

                    this.options[i].innerHTML = text.substring(0,this.length) + '...'; 

                } 

            } 

        } 

        obj = document.getElementById('a'); 

        //想要几个字就改第二个参数; 

        var optionClass = new cutOption(obj , 2); 

        optionClass.init(); 

    </script> 

</body> 

</html> 




  [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]
上一个：javascript Error 对象错误处理
下一个：Javascript模块模式分析
更多图片编程知识: