常用的字体超出隐藏不能兼容H5和ios

所以整理了两种用jquery来实现的方法,然后弊端是只能隐藏指定字数不能段落隐藏

方法一、

//超出隐藏兼容ios
function hide(text,nuber) {
var array = [];
$(text).each(function(){
var content=$.trim($(this).text());//去掉前后文空格
array.push(content);//内容放进数组
})
for(var i=0;i<array.length;i++){
if(array[i].length>=nuber){
//如果数组长度(也就是文本长度)大于等于50(数字可自己定义)
content=array[i].substr(0,nuber)+'...';//添加省略号并放进box文字内容后面
console.log(content)
$(text).eq(i).text(content);
}else{
content=content_arr[i];
$(text).eq(i).text(content);
console.log(content)
}
}

}

//hide(".xxx",12)

方法二、

function hidetext(idclass,nuber){
$(document).ready(function () {
//限制字符个数
$(idclass).each(function () {
const maxnum = nuber;
if ($(this).text().length > maxnum) {
$(this).text($(this).text().substring(0, maxnum));
$(this).html($(this).html() + '...');
}
});
});
}
hidetext(".hide_text2","14")

超出隐藏兼容H5的更多相关文章

  1. table中的td内容超出隐藏

    <table style="table-layout: fixed;width: XXX px"> <tr> <td style="whit ...

  2. CSS 超出隐藏问题

    .dropdown-navbar>li:last-child>a { border-bottom: 0 solid #DDD; border-top: 1px dotted transpa ...

  3. line-height超出隐藏显示的行数和垂直居中

    line-height是css样式里设置行高的方法,在div中有overflow:hidden,可以隐藏超出div的内容,配合行高和div的高,可以设置该div里可以显示几行内容,div可以容纳几个行 ...

  4. css文本超出隐藏 显示三个点

    文本超出显示三个点一般分两种情况 一,单行文本超出隐藏 overflow:hidden; text-overflow:ellipsis; white-space:nowrap; 二,多行文本超出隐藏 ...

  5. CSS实现不换行/自动换行/文本超出隐藏显示省略号

    在写页面的时候,我们经常会需要用到关于文本的换行,强制换行以及显示几行超过显示省略号等,今天我们就对这些问题来做个汇总吧! 1.自动换行 div{ word-wrap:break-word; word ...

  6. CSS——文本超出隐藏显示省略号

    文本超出隐藏显示省略号 1.单行文本的溢出显示省略号 overflow: hidden; text-overflow:ellipsis; white-space: nowrap; // overflo ...

  7. 前端生成分享海报兼容H5和小程序

    ### 移动端分享海报生成 最近做项目需求是生成商品分享海报,并且保存到手机中要兼容H5和小程序<br> 与后端同学沟通后,海报在前端生成最省性能和有较好的交互体验,先看做好的效果

  8. 基于uniapp自定义Navbar+Tabbar组件「兼容H5+小程序+App端Nvue」

    uni-app跨端自定义navbar+tabbar组件|沉浸式导航条|仿咸鱼凸起标签栏 在跨端项目开发中,uniapp是个不错的框架.采用vue.js和小程序语法结构,使得入门开发更容易.拥有非常丰富 ...

  9. css样式之超出隐藏

    文本超出部分隐藏,总结两种方法. 1.单行隐藏 html代码 <div class="mi">当文字超过范围的时候,超出部分会隐藏起来.</div> css ...

随机推荐

  1. 基于Influxdb对InfluxDBResultMapper的一点扩展

    理想很饱满,现实很骨感. 由于业务需要"灵活可配置"的功能需求,在使用java开发Influxdb查询功能的时候,遇到了一个问题,Measurement注解的名称有可能需要动态变化 ...

  2. Angular.js 入门(一)

    最近在学习angular.js,为此方便加深对angular.js前端框架的理解,因此写下这篇angular.js入门 首先介绍下什么是angular.js? AngularJS 是一个 JavaSc ...

  3. nginx搭建web服务器

    现在有如此众多web服务器,我觉得nginx服务器一个很重要的优势就是它能在支持高并发请求的同时保持高效的服务,接下来我将搭建一个简单的web服务器. 1.编写自己的网页 在nginx目录下新建文件夹 ...

  4. python requests-toolbelt 生成上传multipart/form-data格式数据

    需求背景 想使用requests做一个自动上传的功能,发现这里问题挺多的,就记录一下. 如上图上传功能,一般分为input标签,非input标签.我这里也不管什么标签,直接抓包看数据流. Conten ...

  5. Fiddler的基本使用

    目录 清空历史请求 请求所消耗的时间 发送的数据在 设置fiddler过滤请求 模拟弱网环境 Ctrl+R 拦截数据,拦截数据又称"打断点" fiddler开启的时候就是默认开始抓 ...

  6. nishang的介绍与使用

    0x01前言 Nishang是一个PowerShell攻击框架,它是PowerShell攻击脚本和有效载荷的一个集合.Nishang被广泛应用于渗透测试的各个阶段,本文主要介绍如何使用Nishang的 ...

  7. std::unordered_map

    map与unordered_map的区别 1.map: map内部实现了一个红黑树,该结构具有自动排序的功能,因此map内部的所有元素都是有序的,红黑树的每一个节点都代表着map的一个元素, 因此,对 ...

  8. gperftools::TCMalloc

    VS2013编译gperftools-2.4 1)https://github.com/gperftools/gperftools  下载   gperftools-2.4.zip  版本.2)解压  ...

  9. 第三方软件 Serv-u提权

    Serv-U FTP Server,是一种被广泛运用的FTP服务器端软件,支持3x/9x/ME/NT/2K等全Windows系列.可以设定多个FTP服务器.限定登录用户的权限.登录主目录及空间大小等  ...

  10. Spring Boot项目如何同时支持HTTP和HTTPS协议

    如今,企业级应用程序的常见场景是同时支持HTTP和HTTPS两种协议,这篇文章考虑如何让Spring Boot应用程序同时支持HTTP和HTTPS两种协议. 准备 为了使用HTTPS连接器,需要生成一 ...