大家有沒有遇到過一個(gè)問題，就是一個(gè)列表，或是一段文字過多時(shí)，截取多余的部分用省略號(hào)，好吧，證明你實(shí)力的時(shí)候到了，我下面先分解一下方法，再用插件寫出來,首先我們說的是，用到的第一個(gè)方法，就是判斷一個(gè)字符串 多少個(gè)字節(jié)。

function lengthB(str){var num=0,len =str.length;if(len){for(i =0; i<len;i++){if(str.charCodeAt(i)>255){num+=2;}else{num+=1; }}}else{return 0;}return num; }

lengthB,這個(gè)方法，是返回str的字節(jié)數(shù)，charCodeAt(i),返回字符的ascii碼值，>255，為中文，就是2個(gè)字節(jié)，否則，為英文一個(gè)字節(jié)。

測(cè)試看看

var num =lengthB("test多少個(gè)字節(jié)"); alert(num);

第二個(gè)重點(diǎn)來了，傳入?yún)?shù)，str（被截取的字符串）,length(定寬的寬度)，最后返回截取的截取的字符串。

function substringB(str , length){var temp="",num=0;_len = lengthB(str);if(_len){if(_len<length){return str;}else{for(var i =0; i<length; i++){if(num>=length){break;}if(str.charCodeAt(i)>255){num+=2;temp+=str.charAt(i);}else{num+=1;temp+=str.charAt(i);}}return temp;}}else{return null;}}

第三步：終極方法，相比第二個(gè)方法，多了第三個(gè)參數(shù)，默認(rèn)是“...”

function fixedWidth(str,length,char){var str = str.toString();if(!char){var char ="..."} var num = length - lengthB(str);if(num<0){str = substringB(str,length-lengthB(char))+char;}return str; }

注意，返回的str，要把char的字節(jié)數(shù)減掉哦。

下面來封裝一下插件哦，這里我做的是全局的，（大家試下jquery對(duì)象打方法封裝插件。下節(jié)我再公布）

(function($){$.extend($,{fixedWidth :function(str,length,char){var str = str.toString();if(!char){var char ="..."} var num = length - lengthB(str);if(num<0){str = substringB(str,length-lengthB(char))+char;}return str;function lengthB(str){var num=0,len =str.length;if(len){for(i =0; i<len;i++){if(str.charCodeAt(i)>255){num+=2;}else{num+=1; }}}else{return 0;}return num;}function substringB(str , length){var temp="",num=0;_len = lengthB(str);if(_len){if(_len<length){return str;}else{for(var i =0; i<length; i++){if(num>=length){break;}if(str.charCodeAt(i)>255){num+=2;temp+=str.charAt(i);}else{num+=1;temp+=str.charAt(i);}}return temp;}}else{return null;}}}}); })(jQuery);

調(diào)用：

$(function(){var str1 = jQuery.fixedWidth("ddddddfagfa",7);alert(str1); });

?

轉(zhuǎn)載于:https://www.cnblogs.com/jine/archive/2012/08/07/2626006.html

總結(jié)

以上是生活随笔為你收集整理的jquery实战--定宽的全部?jī)?nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯(cuò)，歡迎將生活随笔推薦給好友。