ด้วยสํานึกในพระมหากรุณาธิคุณสมเด็จพระนางเจ้าสิริกิติ์เป็นล้นพ้นอันหาที่สุดมิได้

สอบถามเรื่อง ซ่อน/แสดงข้อมูล หน่อยครับ

ถาม-ตอบ แนะนำไอเดีย โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา สอบถามเรื่อง ซ่อน/แสดงข้อมูล หน่อยครับ

ปัจจุบัน นักพัฒนาสามารถ ใช้ ChatGPT | Gemini | Claude | Perplexity | Deepseek ช่วยในการแก้ไขปัญหาต่างๆ ในการเขียนโปรแกรม หรือหาข้อมูลเพิ่มเติมได้ง่ายและสะดวก แนะนำให้ทุกคนใช้งานเพื่อพัฒนาศักยภาพของตัวเอง

สอบถามเรื่อง ซ่อน/แสดงข้อมูล หน่อยครับ

ตัวอย่างตาม code นี้อ่ะคับ

พอคลิ๊กเพิ่มเติมแล้วเจอข้อมูล

Pusirinon 19-12-2016 11:25:54

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก

ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
User

Pass

Code

จำข้อมูลการล็อกอิน
เข้าระบบอัตโนมัติ

( หรือ เข้าใช้งานผ่าน Social Login )

ล็อกอินด้วย Line

ล็อกอินด้วย Google

ล็อกอินด้วย Twitter

ล็อกอินด้วย Tiktok

ความคิดเห็นที่ 1

หลักการ ซ่อนรายการที่ต้องการ ด้วย css style เช่น สมตติคลุมด้วย div

ถ้าเป็น javascript ธรรมดา ลองศึกษา JavaScript HTML DOM

http://www.w3schools.com/js/js_htmldom.asp

ถ้าใช้ jqeury ดูโค้ดจากตัวอย่างนี้เป็นแนทาง

http://api.jquery.com/slideToggle/

เนื้อหาที่ซ่อนเมื่อเปิดมาครั้งแรก

show ถ้าคลิก แล้วแสดง

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>

  <script src="https://code.jquery.com/jquery-3.1.0.js"></script>
  
</head>
<body>

<style type="text/css">
  #my_div{
    display: none;
    text-align: center;
  }  
  #my_div_click{
    text-align: center;
    cursor: pointer;
  }
</style>  
<div id="my_div">
เนื้อหาที่ซ่อนเมื่อเปิดมาครั้งแรก
</div>
<div id="my_div_click">
show ถ้าคลิก แล้วแสดง 
</div>
<script>
  $(function(){
    $("#my_div_click").on("click",function(){
      $("#my_div").slideToggle("fast",function(){
        var display = $(this).css("display");
        if(display=='none'){
          $("#my_div_click").html("show ถ้าคลิก แล้วแสดง ");
        }else{
          $("#my_div_click").html("hide ถ้าคลิก แล้วซ่อน ");
        }
      });  // แสดงส่วนที่ซ่อน
    });
  });
  </script>  
</body>
</html>

ตัวอย่าง DEMO

ninenik 19-12-2016

ความคิดเห็นที่ 2

ขอบคุณมากครับพี่นิก

pusirinon 19-12-2016 17:17

ขอบคุณทุกการสนับสนุน

สนับสนุนเว็บไซต์เรา จ่ายด้วย Truemoney Wallet

20 บาท 50 บาท 100 บาท 300 บาท หรือ ระบุจำนวน