VietTuts

Tự Học Lập Trình Online

  • Home
  • Java
  • Servlet
  • JSP
  • Struts2
  • Hibernate
  • Spring
  • MyBatis
  • Java WS
  • C
  • C++
  • C#
  • Python
  • PHP
  • Excel
  • VBA
  • Web
    • JavaScript
    • JQUERY
    • JSON
    • AJAX
    • CSS
    • HTML
    • HTML5
    • Node.js
    • Angular 7
  • SQL
    • MySQL
    • SQL Server
  • Misc
    • Eclipse
    • Phần mềm tiện ích
    • Cấu trúc DL&GT
    • Selenium Test

jQuery Tuts

jQuery là gì? Show / hide content in JQuery Checked, unchecked all checkbox in jQuery Validate form in jQuery

Show hide content in jQuery


Hàm show()
Hàm hide()  

Nội dung chính

  • Ví dụ về show / hide content in jQuery:

Ví dụ về show / hide content in jQuery:

Trong ví dụ này, chúng ta sử dụng hàm show() và hide() để xử lý hiện, ẩn nội dung khi click.

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js">
</script>
<script>
  function collapse(id) {
    $("#off-" + id).hide();
    $("#on-" + id).show();
    $("#content-" + id).hide();
  }
  function expand(id) {
    $("#on-" + id).hide();
    $("#off-" + id).show();
    $("#content-" + id).show();
  }
</script>
</head>
<body>

  <div id="off-d1" onclick="collapse('d1');">Hide_D1</div>
  <div id="on-d1" onclick="expand('d1');" style="display: none;">Show_D1</div>
  <div id="content-d1">
    <p>If you click on the "Hide_D1" button, I will disappear.</p>
  </div>

  <div id="off-d2" onclick="collapse('d2');">Hide_D2</div>
  <div id="on-d2" onclick="expand('d2');" style="display: none;">Show_D2</div>
  <div id="content-d2">
    <p>If you click on the "Hide_D2" button, I will disappear.</p>
  </div>

  <div id="off-d3" onclick="collapse('d3');">Hide_D3</div>
  <div id="on-d3" onclick="expand('d3');" style="display: none;">Show_D3</div>
  <div id="content-d3">
    <p>If you click on the "Hide_D3" button, I will disappear.</p>
  </div>

</body>
</html>

Kết quả:


Hàm show()
Hàm hide()  

Recent Updates

Inject JQuery trong Selenium WebDriverJQuery là gì?Checked, unchecked all checkbox in jQueryShow hide content in jQueryBài tập java có lời giảiXử lý duplicate trong SQLPhím tắt hay dùng trong ExcelBảo mật tập tin ExcelDịch trang tính trong ExcelIn trang tính trong ExcelHàm VLOOKUP trong ExcelĐối tượng đồ họa trong ExcelSử dụng macro trong ExcelSử dụng Templates trong ExcelSử dụng chủ đề (theme) trong ExcelSử dụng Style trong Excel

VietTuts on facebook

Học Lập Trình Online Miễn Phí - VietTuts.Vn

Danh sách bài học

Học java
Học servlet
Học jsp
Học Hibernate
Học Struts2
Học Spring
Học SQL

Câu hỏi phỏng vấn

201 câu hỏi phỏng vấn java
25 câu hỏi phỏng vấn servlet
75 câu hỏi phỏng vấn jsp
52 câu hỏi phỏng vấn Hibernate
70 câu hỏi phỏng vấn Spring
57 câu hỏi phỏng vấn SQL

About VietTuts.Vn

Hệ thống bài học trên VietTuts.Vn bao gồm các bài lý thuyết và thực hành về các công nghệ java và công nghệ web. Các bài lý thuyết trên hệ thống VietTuts.Vn được tham khảo và tổng hợp từ các trang http://javatpoint.com, http://www.tutorialspoint.com, http://docs.oracle.com/en …

Scroll back to top

Copyright © 2016 VietTuts.Vn all rights reserved. | VietTuts.Vn team | Liên hệ | Chính sách - riêng tư | sitemap.html | sitemap_index.xml