jQuery截取字符串插件区分中英文
jQuery截取字符串插件区分中英文:
截取字符串功能在大量网站都有应用,比如新闻列表这样的功能,因为新闻的标题长途未必都是恰如其分的,所以要根据需要截取指定长度的字符串,下面就分享一个jQuery实现的插件,此插件能够截取指定长度的字符串,并且能够区分中英文。
代码实例如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=" utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>jQuery截取字符串插件区分中英文-蚂蚁部落</title>
<script type="text/javascript" src="http://www.softwhy.com/mytest/jQuery/jquery-1.8.3.js"></script>
<script type="text/javascript">
(function($){
$.extend($,{
fixedWidth:function(str,length,char){
str=str.toString();
if(!char) char="...";
var num=length-lengthB(str);
if(num<0)
{
str=substringB(str,length-lengthB(char))+char;
}
return str;
function substringB(str,length)
{
var num=0,len=str.length,tenp="";
if(len)
{
for(var i=0;i<len;i++)
{
if(num>length) break;
if(str.charCodeAt(i)>255)
{
num+=2;
tenp+=str.charAt(i);
}
else
{
num++;
tenp+=str.charAt(i);
}
}
return tenp;
}
else
{
return null;
}
}
function lengthB(str)
{
var num=0,len=str.length;
if(len)
{
for(var i=0;i<len;i++)
{
if(str.charCodeAt(i)>255)
{
num+=2;
}
else
{
num++;
}
}
return num;
}
else
{
return 0;
}
}
}
});
})(jQuery);
var str="蚂蚁部落欢迎您,希望您在这里能够有一定的收获";
document.write($.fixedWidth(str,20));
</script>
</head>
<body>
</body>
</html>
以上代码实现了截取字符串的功能,如果字符串超出了指定的长度,那么就会截取规定的长度,然后超出的以省略号替代,下面就介绍一下此插件的实现过程:
一.实现原理:
原理其实很简单的,下面就简单介绍一下:
1.为jQuery类库添加fixedWidth()方法:
实现这个是通过
$.extend()方法来实现的,这个函数式为jQuery类直接添加方法,也就是说添加的函数式静态方法,并非实例方法,关于 $.extend()函数可以参阅
$.extend()函数用法详解一章节。
2.关于中英文区分:
字符串的length属性返回值字符串中字符的个数,也就是说字符串中一个英文单词就是一个字符,一个汉字也是一个字符。但是一个英文字符和一个汉字在内存占据的空间是不一样的,一个英文字符占据一个字节,一个汉字占据两个字节。在这里是通过charCodeAt()函数判断的,如果返回值大于255的话,就说明汉字,那么num就会加2,否则就是英文字符,num加1。至于截取就更容易了,这里就不多说了,参阅代码注释即可。
二.代码注释:
1.(function($){})(jQuery),声明一个匿名函数,并执行此函数,参数是jQuery。
2.$.extend($,{}),为jQuery类库添加静态方法。
3.fixedWidth:function(str,length,char){},要被添加的方法,具有三个参数,str是要被截取的原字符串,length是要被截取的长度,char是自定义以何种形式作为超出内容的省略符号,比如默认状态下是"...",此参数是可选的。
4.var str=str.toString(),转换为字符串。
5.if(!char)
char="...",如果没有没有提供第三个参数,那么默认就是"..."。
6.var
num=length-lengthB(str),要截取的字符长度减去字符的长度,经过lengthB()函数计算,已经区分了中英文。
7.if(num<0){},如果小于0,也就是要截取的长度小于字符串的长度。
8.str=substringB(str,length-lengthB(char))+char,截取指定字符串长度,并加上char。
9.return str,如果要截取的长度大于字符串的长度,那么字符串将会被原样返回。
10function
substringB(str,length){},此函数用来截取字符串,具有两个参数,第一个参数要被截取的原字符串,第二个是要真正被截取的字符串的长度,这个长度是fixedWidth()函数中第二个参数减去被省略字符串替代字符的长度。
11.var num=0,len=str.length,tenp="";声明几个变量并赋值。
12.if(len),判断字符串是否是空字符串。
13.for(var
i=0;i<len;i++){},遍历字符串中的每一个字符。
14.if(num>length)
break,如果num大于真正要被截取的长度,就跳出本次循环。
15.if(str.charCodeAt(i)>255),判断指定索引的Unicode编码是否大约255,如果大于就是汉字,如果小于就是英文字符。
16.num+=2,将num加2.
17.tenp+=str.charAt(i),将指定索引的字符追加到tenp中。
18.else{num++;
tenp+=str.charAt(i)},如果是英文字符,num加1,再将指定索引的字符追加到tenp中。
19.return tenp,返回字符串。
20.function
lengthB(str){},声明一个函数,用来计算字符串的长度,区分中英文,原理这里就不说了,因为和上面介绍的大同小异。
三.相关阅读:
1.length属性可以参阅JavaScript的String对象的length属性一章节。
2.charCodeAt()函数可以参阅JavaScript的String对象的charCodeAt()方法一章节。
3.charAt()函数可以参阅JavaScript的String对象的charAt()方法一章节。
jQuery截取字符串插件区分中英文的更多相关文章
- C# 截取字符串,区分中英文情况
public static string SubstringByCN(string strInput, int begin, int length) { if (!Regex.IsMatch(strI ...
- JS获取字符串长度(区分中英文)
JS获取字符串长度(区分中英文) 中文算2个字,英文一个. function getStrLength(str) { var cArr = str.match(/[^\x00-\xff]/i ...
- jQuery截取字符串、日期字符串转Date、获取html中的纯文本
jQuery截取字符串.日期字符串转Date.获取html中的纯文本. var com = com || {}; (function ($, com) { /* * 截取字符串 * @param st ...
- jQuery截取字符串的几种方式
在我们写前端JS代码的时候,我们会遇到只需要其中部分字符串的时候,下面我就提供集中截取字符串的方法: 1.取后缀 var fileDir = $("#file").val(); v ...
- jQuery截取字符串的几种方法
1.取后缀 var fileDir = $("#file").val(); var suffix = fileDir.substr(fileDir.lastIndexOf(&quo ...
- js截取字符串区分汉字字母代码
js截取字符串并且区分汉字字母,一个汉字辨别为两个字节. function substr(str, len) { if (!str || !len) { return ''; } // 预期计数:中文 ...
- javascript截取字符串(支持中英文混合)
javascript截取字符串(支持中英文混合) <script type="text/javascript"> var sub=function(str,n){ va ...
- 用C#截取指定长度的中英文混合字符串
很早以前写过一篇文章(用C#截取指定长度的中英文混合字符串),但是对性能没有测试,有人说我写的这个方法性能有问题,后来想,可能真会有BT之需求要求传入一个几万K甚至几M体积的字符串进来,那将会影响正则 ...
- jquery获取当前按钮、截取字符串、字符串拼接、动态循环添加元素
截取字符串:字符串拼接:动态循环添加元素:获取当前按钮: {data : null, render: function(data, type, row ) { var loginName = $(&q ...
随机推荐
- 杂题 SPOJ MOBILE2 - Mobiles
MOBILE2 - Mobiles no tags You have been asked to buy a gift for your baby brother, Ike. However, yo ...
- 数学概念——F 概率(经典问题)birthday paradox
F - 概率(经典问题) Time Limit:2000MS Memory Limit:32768KB 64bit IO Format:%lld & %llu Submit S ...
- 【转】Linux 套接字编程中的 5 个隐患
地址:请点击这里
- 对Spring的一些理解
最近在复习一些关于框架的概念性问题,主要是为了最近的面试,怕被问到这些概念性的问题.不过在真正做开发的时候还是要好好理解这些框架的基本原理,以及它们的工作流程.这样,我们才能更好的使用这些框架.下面就 ...
- setState的同步更新
react中的setState特点: 是异步操作函数: 组件在还没有渲染之前, this.setState 还没有被调用: 批量执行 State 转变时让 DOM 渲染更快(相对比一个一个的setSt ...
- docker安装lnmp 环境
docker基础知识请转 docker中文文档:http://docker-doc.readthedocs.io/zh_CN/latest/index.html docker英文文档: https:/ ...
- C# WinForm登录窗口代码
Main窗体为应用程式主窗体,Login为登录窗体.均为SDI窗体. 两种实现方式如下: 1.应用程式入口放在Login窗体,在Login窗体实现登录机制,验证通过则创建Main窗体的实例,并 ...
- Win8 移除右键菜单中的SkyDrive Pro选项
Step 1:进入注册表编辑器 Win + R键调出运行窗口,然后输入regedit,进入注册表编辑器. Step 2:删除下面的键值 HKEY_CLASSES_ROOT\AllFilesystemO ...
- poj 3154 Graveyard 贪心
//poj 3154 //sep9 #include <iostream> #include <cmath> using namespace std; double a[204 ...
- MYSQL 体系结构图-log (踏雪无痕) (UC技术博客)
http://www.cnblogs.com/chenpingzhao/category/690116.html http://www.cnblogs.com/chenpingzhao/p/51074 ...