2. 程式人生 > >JS實現顯示部分文字點選顯示全部

JS實現顯示部分文字點選顯示全部

阿新 • • 發佈：2019-01-18
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>js顯示隱藏層</title>


</head>

<body>
<div id="a" style="height:100px;width:200px;overflow-y:hidden;">
測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句測試語句
</div>
<a href="javascript:void(0)" id="show" style="display:block" onclick="document.getElementById('a').style.height='500';document.getElementById('hidden').style.display='block';document.getElementById('show').style.display='none';">展開</a>
<a href="javascript:void(0)" id="hidden" style="display:none;" onclick="document.getElementById('a').style.height='100';document.getElementById('hidden').style.display='none';document.getElementById('show').style.display='block';">關閉</a>

</body>


</html>

相關推薦

JS實現顯示部分文字點選顯示全部

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html

JS實現預設顯示部分文字點選按鈕顯示全部內容

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html

Winform的TextBox控制元件顯示預設文字點選消失離開顯示

設定TextBox控制元件的預設文字即在載入TextBox控制元件時為其Text文字賦值。點選文字消失，離開或者失去焦點顯示預設文字可以通過Enter和Leave事件或Mouse的事件來實現。具體程式

mlellipsis.js-實現多行文字溢位隱藏顯示省略號

超出容器部分文字做省略，這是基本寫前端程式碼都會遇到的問題。 某些位置為了表現完美不額外加滾動條，都會要求多出的部分作省略，例如文章簡介”今天天氣真的好…”，文字之後部分點選進入詳情頁才能看到，超出多餘的用”…”省略。 然而，一般這些簡介都是用後臺語言去作處理，例如只顯示前

Android 神器之SpanableString實現textview部分字型點選事件（不同顏色），並且支援多個點選事件

1.老規矩，咱們先上效果圖： 2.如上圖 標紅的地方，我們一眼看上去 就是一個TextView上面展示出來的(沒錯就是一個TextView展示出來的)，並且 部分字型顏色不一樣，而且這個三個協議是可以點選的，點選跳轉到不同頁面，怎麼實現尼 ？，這裡就涉及到一個

TextView自定義省略號、部分文字變色、部分文字點選

1、如果文字內容超過最大行數，在兩個字串拼接處新增省略號省略程式碼： ViewTreeObserver observer = textView.getViewTreeObserver();observer.addOnGlobalLayoutListener(new Vie

JS實現 分享視訊中-->點選button(copy),複製對應網址

分享視訊中-->點選button(copy),複製對應網址 HTML頁面程式碼 <input type="text" class="share-input" value="http://

Android 關於TextView中，設定指定部分文字改變顏色，和指定部分文字點選事件

參考文章 我想要實現的是如下這樣的效果 首先要想實現文字變色以及點選，都需要使用到SpannableStringBuilder，例項化該類也很簡單，只需將你想要處理的字串當做引數 Span

js實現無縫滾動，點選可實現左右滾動

<!DOCTYPE HTML> <html lang="en-US"> <head> <meta charset="UTF-8"> <title>無縫滾動——左右</title> <st

原生JS實現點選顯示再次點選隱藏

/** * [Show_Hidden 點選控制div顯示與隱藏] * @param {[id]} obj [需要顯示隱藏div的id] */ function Show_Hidden(obj) { var div = document.g

基於js原生封裝的點選顯示完整文字

基於js原生封裝的點選顯示完整文字 (function(window) { var inner = ''; var showCont_s = function(ele) { this.init.apply(this, arguments); } showC

多行文字省略，js點選顯示更多

html+css: <div id="textInfos" style=" overflow : hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;

js控制文字字數，並能點選顯示和隱藏

很多時候，你不用考慮文字字數的問題，因為和你多地方，如資料庫、後臺控制；都會限制文字字數， 但有時候，比如：你的老闆說，我們現在要做一個簡單的主題介紹單頁，還是要適用於web手機端的；那麼你就有可能會用到以下這段js了，不是特別的複雜，不過一定是實用的。 我寫的很粗糙，大神

js實現密碼框的點擊眼睛的顯示與隱藏

password var ide oct class 密碼框 fun clas ext 密碼框的點擊眼睛的顯示與隱藏，圖標引用是bootstrap中的fontawesome （復制整個 font-awesome 文件夾到您的項目中） 還需要引入 <link rel

使用layer 實現點選 顯示大圖

由於開發時需要用到點選時顯示大圖的功能 遇到百度到一個比較好用的方法,適用程度比較高 廢話不多說,直接貼程式碼 #html部分 <div class="imgview"><img src=""https://avatar.csdn.net/B/7/0/1_qq_3187

Android點選顯示一個可編輯文字的dialog（解決失去游標問題）

前言： 一個簡單的實現方式舉例。 描述： 需求上可能會提出這樣一點：點選一個按鈕，展示一個dialog彈窗，這個彈窗上有①可編輯文字，②確定按鈕，③取消按鈕。 具體操作： 那麼針對這個需求，我們常規性的話，應該建立一個工程，寫一個demo，建立一個BaseActivity介面,讓我們後續建

使用layer 實現點選 顯示大圖

由於開發時需要用到點選時顯示大圖的功能 遇到百度到一個比較好用的方法,適用程度比較高 廢話不多說,直接貼程式碼 #html部分 <div class="imgview"><img src=""https://avatar.csdn.net/B/7/0/

Android 使用jQuery實現item點選顯示或隱藏的特效

效果圖 分析 上圖中的功能在很多APP上都可能用到過，例如app的幫助介面，告訴使用者如何使用APP 一般的實現方式都是通過ListView來實現的，實際上此類需求非常簡單，完全可以用WebView載入HTML來實現 抽屜樣式的顯示隱藏特效可以使

vue 點選展開顯示更多 點選收起部分隱藏

1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>Document</title> 6 &

Android實現ListView顯示資訊，點選每個item，跳轉到相應介面

介面如下：（做這個目的僅僅是為了學習一點小知識，因為自己才剛開始） 實現的方法比較簡單，就是定義一個ListView,然後設定監聽，ListView對每個條目的監聽是setOnItemClickListener。 onItemClick(AdapterView&