js实现下拉框选项文字超出部分出现省略号（...）

代码如下：

<style>
  select{width: 150px}
  select option{display:inline-block;width: 100%}
</style>
<select name="" id = 'box' title='fjsoadajfiojsdoifjiosdjfsdf'>
  <option value='1'>发生的分析水电费是的覅偶违法水电费水电费水电费违法</option>
  <option value='2'>发生的分析水电费是的覅偶违法水电费水电费违法</option>
  <option value='3'>发生的分析水电费是的覅偶违</option>
</select>

<script>
  function CutOption( selectObj, length ) {
    this.selectObj = selectObj 
    this.length = length
}
CutOption.prototype.init = function() {
  this.options = this.selectObj.getElementsByTagName('option')
  for(var i=0;i<this.options.legnth;i++){
    text = this.options[i].firstChild.nodeValue
    if(text.length <= this.length) {
      return
    }else{
      this.options[i].innerHTML = text.substring(0. this.legnth)+ '...'
    }
  }
}
// 调用
var obj = document.getElementById('box')
var len = Math.floor(parseFloat( getComputedStyle( obj, false ).width )/18)
var optionClass = new CutOption(obj, 8)
optionClass.init()
</script>