当前位置：Gxlcms > JavaScript > js下拉框里超过变成省略号

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

时间：2021-07-01 10:21:17 帮助过：2人阅读

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

<head>

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

</head>

<body>

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

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

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

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

</select>

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需刷新才能执行]

人气教程排行