对于单文本或者div的内容怎么在显示东西过多的情况下实现显示隐藏
js代码:
$(function () {
var o = document.getElementById("newsdetail_ArticleContent");
Subt(o);
});
function Subt(obj) {
var s = obj.innerHTML;
var p = document.createElement("span");
var n = document.createElement("a");
p.innerHTML = s.substring(0, 1100);
n.innerHTML = s.length > 1100 ? "查看更多" : "";
n.href = "javascript:void(0);";
n.className = 'c00aeff fs16';
n.onclick = function () {
if (n.innerHTML == "查看更多") {
n.innerHTML="点击隐藏";
p.innerHTML = s;
} else {
n.innerHTML = "查看更多";
p.innerHTML = s.substring(0, 1100);
}
}
obj.innerHTML = "";
obj.appendChild(p);
obj.appendChild(n);
}
html代码结构
<div id="newsdetail_ArticleContent" class="c666666 lh30 pl30 pr30 pt20 pb20" style="font-family: '黑体';"><span><span><p style="text-indent:2em;">
</span></span></div>
这样就实现了js控制单文本内容过多的显示隐藏问题
对于单文本或者div的内容怎么在显示东西过多的情况下实现显示隐藏的更多相关文章
- div样式text-align在子元素缩进不规范的情况下,chrome出现的问题(貌似结果是inline-block导致的)
在调css的时候,发现居然有firefox实现效果完整而chrome出现问题的情况: 详细情况:segmentfault1 segmentfault2 全文表达: <html><he ...
- span标签里的内容在IE下显示,而在谷歌浏览器下不显示
有如下代码: <span id="spLicenseIncrease" style="color:red;">(51)</span> 在 ...
- HTML中让表单input等文本框为只读不可编辑但可以获取value值的方法;让文本域前面的内容显示在左上角,居中
HTML中让表单input等文本框为只读不可编辑的方法 有时候,我们希望表单中的文本框是只读的,让用户不能修改其中的信息,如使input text的内容,中国两个字不可以修改 有时候,我们希望 ...
- 修改placeholder提示内容的颜色以及文本框输入文字内容的颜色
一般表单文本框提示信息:placeholder=" ",默认颜色是灰色的,输入文本信息也是默认为黑色的,如图所示: 修改placeholder提示内容的颜色关键代码及实现: 实现输 ...
- DEV中dx:ASPxPopupControl 控件的使用(在窗口关闭或隐藏时,清楚文本框中的内容)
//在窗口关闭或隐藏时,清楚文本框中的内容(核心代码) function(s, e) { ASPxClientEdit.ClearGroup('entryGroup'); } <asp:Cont ...
- 使用WebBrowser控件时在网页元素上绘制文本或其他自定义内容
原文:使用WebBrowser控件时在网页元素上绘制文本或其他自定义内容 第一次在CNBlogs上发Post是提出一个有关使用WebBrowser控件时对SELECT网页元素操作的疑惑,这个问题至今也 ...
- css 文本和div垂直居中方法汇总
https://blog.csdn.net/u014607184/article/details/51820508 https://blog.csdn.net/liuying1802028915/ar ...
- DIV的内容自动换行
word-break:break-all和word-wrap:break-word都是能使其容器如DIV的内容自动换行. 它们的区别就在于: 1,word-break:break-all 例如div宽 ...
- select()事件默认选中文本框的全部内容,并改变其背景色和文字颜色
1.select()事件默认选中文本框的全部内容 拿到input标签的节点,调用select()方法即可.但是我做的vue项目中调用了此方法有一个bug,单次点击会全选内容,双次点击的时候全选会闪一下 ...
随机推荐
- 如何将Jenkins multiline string parameter的多行文本优雅的保存为文件
[现象]: 使用multi-line string parameter获取的文本变量,在jenkins shell里面显示为单行文本(空格分割). [问题]:能否转换为多行文本,并存入文件. [解决方 ...
- From Alpha to Gamma (I)
What we think of as conventional alpha-blending is basically wrong. --Tom Forsyth 前段时间在Amazon上淘的三本二手 ...
- 使用session的监听器获取当前在线人数
1首先在web.xml中配置Session的监听器 2创建监听器并且继承HttpSessionListener 3.在jsp中导入监听器 4.获取当前在线人数 5.配置到公共网络(使用natapp的免 ...
- [As3.0] 获取本机信息
package { import flash.display.Sprite; import flash.events.Event; import flash.net.NetworkInfo; impo ...
- C#数据库连接方法
一:C# 连接SQL数据库 Data Source=myServerAddress;Initial Catalog=myDataBase;User Id=myUsername;Password=myP ...
- 使用python+selenium对web进行自动化测试
想用python代码,对web网页进行自动化测试 web自动化测试和手动测试的区别: 手动测试:通过手动去对网页的功能进行点点点 web自动化:可以通过代码,自动对网页点点点 首先,将python+s ...
- Google Maps-IP地址的可视化查询
转自:http://www1.huachu.com.cn/read/readbookinfo.asp?sectionid=1000004203 第3章 实战Google Maps API之一——IP地 ...
- C++ STL 初探
学过C++的人肯定会很熟悉STL标准模板库,STL其实就是封装了一系列的接口,供我们调用.很多函数或者算法的实现不需要我们从头开始写,大大提高我们的编程效率.这篇博客在简单介绍STL的情况下,会详细的 ...
- ElasticSearch-SQL 安装和使用
ES上线之后,用lucene语法来查询数据,学习成本略高,所以考虑用es-sql来简化这部分的操作. ES版本:5.4.0,节点部署如下: master node:3 client node:2,po ...
- Spring Security构建Rest服务-0701-个性化用户认证流程
上一篇说了用户认证的基本流程,但是上一篇当访问一个受保护的服务后,如果未认证会调到默认的登录页面,这样是不行的,而且认证成功后,就直接访问了那个服务,如果想要做认证成功后做一些操作,还需要自定义. 个 ...