/** * 处理select文字过长显示省略号 * @param {*} _class * @param {*} _this * @param {*} _len1显示字节长度 */ export function showEllipsis (_class, _this, _len1) { let inputDom = document.querySelectorAll(_class) // console.log(inputDom) inputDom.forEach(item => { _this.$nextTick(() => { if (getByteLen(item.value) > _len1) { // console.log(reBytesStr(item.value, _len1) + '...') item.value = reBytesStr(item.value, _len1) + '...' } }) }) }
/** * 字符串根据字节截取字符串 * @param {*} str * @param {*} len */ export function reBytesStr (str, len) { if ((!str && typeof (str) !== 'undefined')) { return '' } let num = 0 let str1 = str let returnStr = '' for (let i = 0, lens = str1.length; i < lens; i++) { num += ((str1.charCodeAt(i) > 255) ? 2 : 1) if (num > len) { // 字节大于规定字节退出循环 break } else { returnStr = str1.substring(0, i + 1) } } return returnStr }
/** * 判断字符串占用字节 * @param {*} val */ export function getByteLen (val) { let len = 0 for (let i = 0; i < val.length; i++) { if (val[i].match(/[^x00-xff]/ig) !== null) { len += 2 // 如果是全角,占用两个字节 } else { len += 1 // 半角占用一个字节 } } return len }
备注:举例使用
showEllipsis('.el-dialog .el-select input', this, 14)