Code button ẩn hiển dữ liệu phone text bằng Javascript

Trong quá trình xây dựng website, nếu bạn đang đã gặp phải vấn đề về việc tạo button ẩn hiện một phần tử nào đó, có thể là một phần nội dung, quảng cáo hay số điện thoại và bất cứ thứ gì trên trang. Trong bài viết này, Toancr.com xin chia sẻ cho bạn đọc một số giải pháp như dưới đây.

Code tạo Toggle ẩn/hiện một phần tử

<div class="grid-container">
  <button onclick="myFunction()">Bấm vào đây</button>
 
  <div id="myDIV">
    Chào mừng bạn đến với website của Toàn
    hãy liên hệ với Toàn theo số 0935961044
  </div>
</div>

<style>
button {
  margin: auto;
  width: 100px;
  height: 30px;
  margin-bottom: 10px;
  display: block;
}
#myDIV {
  width: 100%;
  padding: 10px;
  text-align: center;
  height: 80px;
  background: #00FF66;
  margin-bottom: 30px;
  display: inline-block;
}
</style>

<script type="text/javascript">
  function myFunction() {
    var x = document.getElementById('myDIV');
    if (x.style.display === 'none') {
        x.style.display = 'block';
    } else {
        x.style.display = 'none';
    }
  }
</script>

Kết quả:

Code hiển thị thông báo

<button name="button" value="OK" type="button" onclick="phone()">Bấm để xem số điện thoại</button>  
<script>  
  function phone(){  
    alert("Số hotline của Toàn là 0935.961.044");  
  }  
</script>

Xem Thêm : Bảo hiểm nhà xưởng tại Long An