layui设置超过x个字符宽度的字符串阶段后隐藏后点击在弹窗中显示完整字符串

html 

            <li class="acDetail_li ">
                <div class="left_div">xxxx:</div>
                <div id="makeFor" class="right_div"   title=""></div>
            </li>

js 

<script type="text/javascript">
    var makeFor

    myjstools.ajax(false, 'POST', '/xxx/xxxxx',{processInstance_id:processInstance_id}, function (data) {
        try {
            let num = 15 // 字符串长度限制
            if (data.entity.makeFor.length > num ){
                let leng = 0 ; bytea = data.entity.makeFor.length
                let b = 0
                for (let i = 0; i < bytea ;i++ ){
                    if ( b >= (num-1)){ //如果字节长度到 num 则下次循环不进行
                        i = bytea
                    }
                    if(data.entity.makeFor.charCodeAt(i) > 255) {  //字符编码大于255,说明是双字节字符
                        b += 2;  //则累加2个
                        leng ++; //字符数+1
                    }else {
                        leng ++;
                        b ++;  //否则递加一次
                    }
                }
                let makeFor = data.entity.makeFor.slice(0,leng)+'...'
                this.makeFor = data.entity.makeFor

                $("#makeFor").html(makeFor);
                $("#makeFor").attr('class',"right_div hand")
                $("#makeFor").attr('onclick',"showMakeFor()")
            }else{
                $("#makeFor").html(data.entity.makeFor);
            }
                    } catch (e) {
            myjstools.showerrinfo("login_res.error:出错了!" + e.message);
        }
    });

    function showMakeFor(){

        let a = this.makeFor

        layui.use("layer", function () {
            layer.alert(a, {
                skin: 'layui-layer-lan'
                ,closeBtn: 0,
                title:'用车去向'
            })
        });
    }

</script>

css

        .hand{
            cursor: pointer;
        }

 

Guess you like

Origin blog.csdn.net/jtfyh/article/details/120845256