Skip to content

Instantly share code, notes, and snippets.

@phuoctamm

phuoctamm/quang.html

Created May 30, 2019 09:40
Show Gist options
  • Save phuoctamm/dfca22077fe6acdb4420a065a7761bcc to your computer and use it in GitHub Desktop.
Save phuoctamm/dfca22077fe6acdb4420a065a7761bcc to your computer and use it in GitHub Desktop.
Download ZIP
Raw
quang.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<script
src="https://code.jquery.com/jquery-3.4.1.min.js"
integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
crossorigin="anonymous"></script>
<title>Document</title>
<style>
.hide {
display: none;
}
</style>
</head>
<body>
<button class="button" data-vanban="vanban1">Show van ban 1</button>
<button class="button" data-vanban="vanban2">Show van ban 2</button>
<button class="button" data-vanban="vanban3">Show van ban 3</button>
<div id="vanban1" class="hide">
<p>noidung</p>
<p style="color: red">dfsdfsdfsd</p>
</div>
<div id="vanban2" class="hide">
<p>noidung 2</p>
<p style="color: red">dfsdfsdfsd</p>
</div>
<div id="vanban3" class="hide">
<p>noidung 3</p>
<p style="color: red">dfsdfsdfsd</p>
</div>
<script>
$(document).ready(function() {
$(".button").click(function() {
let id = $(this).attr("data-vanban");
$("#vanban1").hide();
$("#vanban2").hide();
$("#vanban3").hide();
$("#" + id).show();
});
});
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment