js中根据字数截取字符串,不能截断url

 更新时间:2012年01月12日 13:23:58   作者:  
给一个文字,对输出的文字进行截取,保留400个字符,其中对url的保留比较麻烦,尤其是有两个相同url时不能采用indexOf获取其字符位置
今天收到个需求:
1,给一个文字,对输出的文字进行截取,保留400个字符
2,截取内容最后如果是url,保留完整url地址
3,添加省略号......
----
其中对url的保留比较麻烦,尤其是有两个相同url时不能采用indexOf获取其字符位置。
处理结果:

相关代码:
复制代码 代码如下:

String.prototype.sizeAt = function(){
var nLen = 0;
for(var i = 0, end = this.length; i<end; i++){
nLen += this.charCodeAt(i)>128?2:1;
}
return nLen;
};
String.prototype.cutStr = function(n, sCut){
if(this.sizeAt() <= n){
return this;
}
sCut = sCut || "";
var max = n-sCut.sizeAt();
var nLen = 0;
var s = this;
for(var i =0,end = this.length;i<end;i++){
nLen += this.charCodeAt(i)>128?2:1;
if(nLen>max){
s = this.slice(0,i);
s += sCut;
break;
}
}
return s.toString();
};
String.prototype.cutStrButUrl = function(n, sCut){
if(this.sizeAt() <=n){
return this.toString();
}
sCut = sCut || "";
var max = n-sCut.sizeAt();
var s = this;
//查找所有包含的url
var aUrl = s.match(/https?:\/\/[a-zA-Z0-9]+(\.[a-zA-Z0-9]+)+([-_A-Z0-9a-z\$\.\+\!\*\/,:;@&=\?\~\#\%]*)*/gi);
//当第max个字符刚好在url之间时,bCut会被设置为flase;
var bCut = true;
if(aUrl){
//对每个url进行判断
for(var i=0, endI = aUrl.length;i<endI;i++){
var sUrl = aUrl[i];
//可能出现两个相同url的情况
var aP = s.split(sUrl);
var nCurr = 0;
var nLenURL = sUrl.sizeAt();
var sResult = "";
for(j = 0, endJ = aP.length; j<endJ; j++){
nCurr +=aP[j].sizeAt();
sResult +=aP[j];
sResult += sUrl;
//当前字数相加少于max但添加url超过max:即会截到url
if(nCurr < max && nCurr + nLenURL>max){
s = sResult + sCut;
bCut = false;
break;
}
nCurr += nLenURL;
}
if(bCut === false){
break;
}
};
}
if(bCut){
s = s.cutStr(n, sCut);
}
return s.toString();
};
console.log('正常截取20个字符'.cutStrButUrl(20,'......'));
console.log('正常截取20个字符,但我超了'.cutStrButUrl(20,'......'));
console.log('有url的字符串http://www.baidu.com你能截取到吗?'.cutStrButUrl(20,'......'));
console.log('http://www.baidu.com有两个相同url的字符串http://www.baidu.com好吗?'.cutStrButUrl(51, '......'));

相关文章

  • js实现按钮控制图片360度翻转特效的方法

    js实现按钮控制图片360度翻转特效的方法

    这篇文章主要介绍了js实现按钮控制图片360度翻转特效的方法,涉及HTML5中canvas方法的使用技巧,具有一定参考借鉴价值,需要的朋友可以参考下
    2015-02-02
  • JS中常用的消息框总结

    JS中常用的消息框总结

    小编给大家总结了JS最常用到的几种消息提示框,大家应该经常用的到,一起学习下吧。
    2018-02-02
  • 原生JavaScript实现轮播图

    原生JavaScript实现轮播图

    这篇文章主要为大家详细介绍了原生JavaScript实现轮播图,文中示例代码介绍的非常详细,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2021-01-01
  • js DOM的学习笔记

    js DOM的学习笔记

    DOM是Document Object Model文档对象模型的缩写;使用JavaScript操作DOM进行DHTML开发
    2011-12-12
  • javascript中关于执行环境的杂谈

    javascript中关于执行环境的杂谈

    如你所知,javascript里执行环境是作为一个最核心的概念存在的。相信广大FE筒子们对于这个概念不会陌生,它定义了变量或函数有权访问其他数据范围以及其行为。
    2011-08-08
  • 浅谈JavaScript异步编程

    浅谈JavaScript异步编程

    本文主要介绍了javascript的异步编程相关知识。具有一定的参考价值,下面跟着小编一起来看下吧
    2017-01-01
  • js 关键词高亮(根据ID/tag高亮关键字)案例介绍

    js 关键词高亮(根据ID/tag高亮关键字)案例介绍

    关键词高亮在开发中会带来很多的方便,关键词高亮包括:根据ID高亮关键字/根据Tag名高亮关键字等等,感兴趣的朋友可以了解下,希望本文对你有所帮助
    2013-01-01
  • WdatePicker.js时间日期插件的使用方法

    WdatePicker.js时间日期插件的使用方法

    本篇文章主要介绍了WdatePicker.js时间日期插件的使用方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
    2017-07-07
  • js实现addClass,removeClass,hasClass的函数代码

    js实现addClass,removeClass,hasClass的函数代码

    js实现addClass,removeClass,hasClass的函数代码,需要的朋友可以参考下。
    2011-07-07
  • 防止按钮在短时间内被多次点击的方法

    防止按钮在短时间内被多次点击的方法

    一个按钮可以在短时间内多次点击,那么有可能会被用户恶意点击,下面有个不错的方法可以有效制止,希望对大家有所帮助
    2014-03-03

最新评论