固定宽度的select下拉单,值过长导致显示不全的问题解决方案

来源:互联网 发布:三丰cmm编程视频 编辑:程序博客网 时间:2024/05/25 23:28

如下图所示为固定宽度的select下拉单,值过长导致显示不全的效果图

解决方案:

function testSelect(){
   
    //获取下拉单id(accReasonCode.accBookId)的对象
    var accBookId = id("accReasonCode.accBookId");
   
    //获取下拉单的值
    var accBookIds = accBookId.value;
   
    //声明两个数组分别用于存放下拉单的option value 和option实际显示的值
    var keyArray = [];
    var valueArray = [];
   
    if(accBookId.options){
     var size = accBookId.options.length;
     for(var i=0; i<size; i++){
      var key = accBookId.options[i].value;
      var value = accBookId.options[i].text;
      keyArray.push(key);
      valueArray.push(value);
     }
     
     //置空下拉单
     accBookId.options.length=0;
     
     //重新生成下拉单
     for(var i=0;i<keyArray.length;i++){
     
      //key在后,值在前
      var option = new Option(valueArray[i],keyArray[i]);
     
      //添加title属性
      option.title = valueArray[i];
      accBookId.add(option);
     }
    }
   
    //选中起始值对应的下拉选项
    accBookId.value = accBookIds;
   
   }
 
执行上述js代码,效果图如下,本着抛砖引玉的目的,希望大家多多提意见
 

0 0
原创粉丝点击