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, '......'));

相关文章

  • javascript prototype原型操作笔记

    javascript prototype原型操作笔记

    在 JavaScript 中,prototype 不但能让对象共享自己财富,而且 prototype 还有寻根问祖的天性,从而使得先辈们的遗产可以代代相传。
    2009-12-12
  • 微信小程序引入外部icon(阿里巴巴矢量图标)的全过程

    微信小程序引入外部icon(阿里巴巴矢量图标)的全过程

    在小程序中,有默认的图标icon组件,但你会发现它的图标样式很少,可能很多时候并不能满足我们的需求,所以这篇文章主要给大家介绍了关于微信小程序引入外部icon(阿里巴巴矢量图标)的相关资料,需要的朋友可以参考下
    2022-09-09
  • JS的location.href跳出框架打开新页面的方法

    JS的location.href跳出框架打开新页面的方法

    登录页面在框架内打开,想让它直接跳出框架打开(这里不是打开新窗口),终于在网上找到了办法,下面分享给大家
    2014-09-09
  • 基于zepto.js实现手机相册功能

    基于zepto.js实现手机相册功能

    这篇文章主要为大家详细介绍了基于zepto.js实现手机相册功能,具有一定的参考价值,感兴趣的小伙伴们可以参考一下
    2017-07-07
  • 解决bootstrap中modal遇到Esc键无法关闭页面

    解决bootstrap中modal遇到Esc键无法关闭页面

    Bootstrap,来自 Twitter,是目前最受欢迎的前端框架。Bootstrap 是基于 HTML、CSS、JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加快捷。不过在使用的过程中,我们还是会遇到各种小问题,今天我们探讨的就是个人在使用中遇到的一个小BUG的修复。
    2015-03-03
  • JavaScript中子对象访问父对象的方式详解

    JavaScript中子对象访问父对象的方式详解

    js中虽然没有传统面向对象的编程语言里子类访问父类的特殊语法,但是我们可以根据需要造一个,接下来本文给大家分享在JavaScript中子对象访问父对象的方式,需要的朋友可以参考下
    2016-09-09
  • JS Range HTML文档/文字内容选中、库及应用介绍

    JS Range HTML文档/文字内容选中、库及应用介绍

    本文的内容基本上是基于“区域范围对象(Range objects)”这个概念来说的
    2011-05-05
  • Express框架详解app函数使用实例

    Express框架详解app函数使用实例

    这篇文章主要为大家介绍了Express框架app函数使用实例详解,有需要的朋友可以借鉴参考下,希望能够有所帮助,祝大家多多进步,早日升职加薪
    2023-03-03
  • Weex开发之地图篇的具体使用

    Weex开发之地图篇的具体使用

    这篇文章主要介绍了Weex开发之地图篇的具体使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
    2019-10-10
  • JS调用Android、Ios原生控件

    JS调用Android、Ios原生控件

    本文主要介绍了JS调用Android、Ios通信的相同点和不同点,以便帮助我们在进行混合式开发时,提高代码质量,实现两者在网页端代码的统一。下面跟着小编一起来看下吧
    2017-01-01

最新评论