前端問(wèn)題多行點(diǎn)點(diǎn)點(diǎn)的問(wèn)題

anRui 發(fā)布于2019-08-20 18:24 / 3171人閱讀

摘要：點(diǎn)點(diǎn)點(diǎn)獲取字符串實(shí)際長(zhǎng)度漢字英文點(diǎn)占點(diǎn)點(diǎn)點(diǎn)解決代碼是多行可放的最大英文字符數(shù)可以自行調(diào)節(jié)進(jìn)行適配

        //點(diǎn)點(diǎn)點(diǎn)獲取字符串實(shí)際長(zhǎng)度(漢字2,英文1,點(diǎn)占0.7)
        function get_strlength(str) {  
            var len = 0;
            if(str.match(/[^ -~]/g) == null) {
                len = str.length;
            } else {
                len = str.length + str.match(/[^ -~]/g).length;
            }
            if (str.match(/./g) != null){
                len -= (str.match(/./g).length * 0.3);
            }
            return len;
        }
        
        //點(diǎn)點(diǎn)點(diǎn)解決代碼,maxLength是多行可放的最大英文字符數(shù)
        function getDotMessage(str , maxLength) {
            maxLength += (str.slice(0,maxLength).match(/./g) != null ? str.slice(0,maxLength).match(/./g).length : 0)*0.3;
            var str1 = "",
                endMaxLength = Math.floor(maxLength),
                maxLen = Math.floor(maxLength);
            if (get_strlength(str) >= maxLen){
                str1 = str.slice(0);
                while (get_strlength(str1) > endMaxLength){
                    str1 = str1.substring(0 , --maxLen);
                }
                return str1 + "..." ;
            }else {
                return str ;
            }
                        
        }

可以自行調(diào)節(jié)maxLength進(jìn)行適配!

GPU云服務(wù)器云服務(wù)器 python 問(wèn)題點(diǎn) cdn回源的幾點(diǎn)問(wèn)題 java前端安全問(wèn)題多行點(diǎn)

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://hztianpu.com/yun/84463.html

相關(guān)文章

案例 - 收藏集 - 掘金

摘要：同行這么做使用實(shí)現(xiàn)圓形進(jìn)度條前端掘金在開(kāi)發(fā)微信小程序的時(shí)候，遇到圓形進(jìn)度條的需求。實(shí)現(xiàn)也談數(shù)組去重前端掘金的數(shù)組去重是一個(gè)老生常談的話(huà)題了。百度前端技術(shù)學(xué)院自定義前端掘金一標(biāo)簽概念元素表示用戶(hù)界面中項(xiàng)目的標(biāo)題。閑話(huà)圖片上傳 - 掘金作者：孫輝，美團(tuán)金融前端團(tuán)隊(duì)成員。15年畢業(yè)加入美團(tuán)，相信技術(shù)，更相信技術(shù)只是大千世界里知識(shí)的一種，個(gè)人博客: https://sunyuhui.com ...

張金寶 2019-08-20 17:44 評(píng)論0 收藏0
案例 - 收藏集 - 掘金

摘要：同行這么做使用實(shí)現(xiàn)圓形進(jìn)度條前端掘金在開(kāi)發(fā)微信小程序的時(shí)候，遇到圓形進(jìn)度條的需求。實(shí)現(xiàn)也談數(shù)組去重前端掘金的數(shù)組去重是一個(gè)老生常談的話(huà)題了。百度前端技術(shù)學(xué)院自定義前端掘金一標(biāo)簽概念元素表示用戶(hù)界面中項(xiàng)目的標(biāo)題。閑話(huà)圖片上傳 - 掘金作者：孫輝，美團(tuán)金融前端團(tuán)隊(duì)成員。15年畢業(yè)加入美團(tuán)，相信技術(shù)，更相信技術(shù)只是大千世界里知識(shí)的一種，個(gè)人博客: https://sunyuhui.com ...

huangjinnan 2019-08-29 12:54 評(píng)論0 收藏0
css - 收藏集 - 掘金

摘要：絕對(duì)底部前端掘金來(lái)自國(guó)外的設(shè)計(jì)達(dá)人，純，可以實(shí)現(xiàn)當(dāng)正文內(nèi)容很少時(shí)，底部位于窗口最下面。有效解決圖片使用單位邊角缺失的問(wèn)題前端掘金起因在移動(dòng)端使用布局時(shí)圖片也需要用單位。 CSS 絕對(duì)底部 - 前端 - 掘金來(lái)自國(guó)外的設(shè)計(jì)達(dá)人，純CSS，可以實(shí)現(xiàn): 當(dāng)正文內(nèi)容很少時(shí)，底部位于窗口最下面。當(dāng)改變窗口高度時(shí)，不會(huì)出現(xiàn)重疊問(wèn)題。甚至，創(chuàng)造該CSS的人還專(zhuān)門(mén)成立一個(gè)網(wǎng)站介紹這個(gè)CSS底部布局方案...

phpmatt 2019-08-29 12:41 評(píng)論0 收藏0
黑科技：CSS定制多行省略

摘要：多行省略就是大段文字后面的花式點(diǎn)點(diǎn)點(diǎn)。但它固定使用省略號(hào)，無(wú)法直接擴(kuò)展。年月日，騰訊控股有限公司在香港聯(lián)交所主板公開(kāi)上市股票代號(hào)。轉(zhuǎn)載請(qǐng)注明出處：http://hai.li/2017/03/08/css-... 什么是多行省略？ showImg(https://segmentfault.com/img/bVKr2N?w=660&h=325); 當(dāng)字?jǐn)?shù)多到一定程度就顯示省略號(hào)點(diǎn)點(diǎn)點(diǎn)。最...

Leo_chen 2019-08-30 15:53 評(píng)論0 收藏0
黑科技：CSS定制多行省略

摘要：多行省略就是大段文字后面的花式點(diǎn)點(diǎn)點(diǎn)。但它固定使用省略號(hào)，無(wú)法直接擴(kuò)展。年月日，騰訊控股有限公司在香港聯(lián)交所主板公開(kāi)上市股票代號(hào)。轉(zhuǎn)載請(qǐng)注明出處：http://hai.li/2017/03/08/css-... 什么是多行省略？ showImg(https://segmentfault.com/img/bVKr2N?w=660&h=325); 當(dāng)字?jǐn)?shù)多到一定程度就顯示省略號(hào)點(diǎn)點(diǎn)點(diǎn)。最...

wpw 2019-08-01 16:29 評(píng)論0 收藏0