jquery等宽输出文字插件使用介绍

代码如下:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<script>
(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 a="abcde我是谁呢？";
alert(jQuery.fixedWidth(a,10));
</script>

赞 (0)

相关推荐

  • jquery等宽输出文字插件使用介绍

    复制代码 代码如下: <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> <script> (function($){ $.extend($,{ fixedWidth:function(str,length,char){ str=str.toString();

  • JQuery的Alert消息框插件使用介绍

    下载JS文件引用到page中,如下代码: 复制代码 代码如下: <!-- Dependencies --> <script src="/path/to/jquery.js" type="text/javascript"></script> <script src="/path/to/jquery.ui.draggable.js" type="text/javascript">&l

  • jQuery powerFloat万能浮动层下拉层插件使用介绍

    jQuery powerFloat万能浮动层下拉层插件使用介绍

    一.写插件的缘由 为什么想写此插件,想来想去,归结为一个字:"懒".不想为明明两个类似的功能分别写代码,本应喝茶看美女的休闲时光晃荡在本可避免的代码上,对于我来讲,就是白白耗费自己的青春.于是,干脆,一鼓作气,把这些类似的功能集合到一起,一个插件搞定,一了百了了.这种感觉就好比<大话西游>里悟空一巴掌拍死唐僧这只苍蝇一样.那,这里提及的类似的功能是指?当当当当,就是与某元素有位置关系的浮动层(例如tip类效果,鼠标经过显示大图,下拉列表等). 二.插件概述 插件名为jque

  • jQuery实现的动态文字变化输出效果示例【附演示与demo源码下载】

    jQuery实现的动态文字变化输出效果示例【附演示与demo源码下载】

    本文实例讲述了jQuery实现的动态文字变化输出效果.分享给大家供大家参考,具体如下: 演示效果图如下: 1.完整实例代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-Typ

  • jQuery自定义图片上传插件实例代码

    jQuery自定义图片上传插件实例代码

    摘要 1.jquery自定义插件方法 2.表单file样式调整 3.利用formData,ajax上传图片 4.js,css弹出层 5.springmvc上传图片 效果 调用方式 $("#picUrl").imgUpload({}),在代码内部为调用对象绑定了click事件,点击弹出上传界面. $(function(){ $("#picUrl").imgUpload({url:'<%=basePath%>'+'file/upload.do'}) $(&q

  • jQuery.Validate表单验证插件的使用示例详解

    jQuery Validate 插件为表单提供了强大的验证功能,让客户端表单验证变得更简单,同时提供了大量的定制选项,满足应用程序各种需求. 请在这里查看示例 validate示例 示例包含 验证错误时,显示红色错误提示 自定义验证规则 引入中文错误提示 重置表单需要执行2句话 源码示例 <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <

  • jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解

    jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解

    jQuery Json数据格式排版高亮插件json-viewer.js使用方法详解 1.插件介绍: jquery.json-viewer.js是一款查看json格式数据的jquery插件.它可以将混乱的json数据漂亮的方式展示在页面中,并支持节点的伸展和收缩和语法高亮等功能. 2.代码演示: 1).首先引入jquery和json.viewer.js插件 <script src="http://www.jq22.com/jquery/jquery-1.10.2.js">&l

  • 基于jQuery下拉选择框插件支持单选多选功能代码

    基于jQuery下拉选择框插件支持单选多选功能代码

    由于最近项目的需求,需要做一个下拉选择框的插件,支持单选显示表单数据,多选显示表格数据,该插件主要运用了jQuery与jqgrid以及easyui. 下面给大家展示下效果图,如果大家感觉还不错,请参考实现代码: 多选:呈现列表 具体代码如下所示: /** *下拉框插件-chooseList *调用插件的方式以及格式: * 1.首先你需要创建一个div面板,给div定义ID * 2.在你所需要的地方调用插件: * 参数说明: * $("#divID").chooseList({ * qu

  • 基于jQuery实现的QQ表情插件

    基于jQuery实现的QQ表情插件

    不废话了,先给大家展示效果图: 查看演示 下载源码 我们在QQ聊天或者发表评论.微博时,会有一个允许加入表情的功能,点击表情按钮,会弹出一系列表情小图片,选中某个表情图片即可发表的丰富的含表情的内容.今天和大家分享一款基于jQuery的QQ表情插件,您可以轻松将其应用到你的项目中. HTML 首先在html页面的head中引入jQuery库文件和QQ表情插件jquery.qqFace.js文件. <script type="text/javascript" src="j

  • jQuery实现鼠标选中文字后弹出提示窗口效果【附demo源码】

    jQuery实现鼠标选中文字后弹出提示窗口效果【附demo源码】

    本文实例讲述了jQuery实现鼠标选中文字后弹出提示窗口效果.分享给大家供大家参考,具体如下: 运行效果截图如下: 具体代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta http-equiv="Content-

随机推荐