Sự kiện click() trong JavaScript

• Trần Thị Vân
• 1267
• 25/08/2025

Chức năng của Sự kiện click() trong JavaScript

Sự kiện click() trong JavaScript dùng để xử lý sự kiện click chuột vào nút gửi hay một trong những thẻ HTML nào đó.

Các cách gán Sự kiện click() trong JavaScript

Sự kiện click() gán trực tiếp trong JavaScript

onclick="xemTuoi()"

<label for="tuoi">Nhập tuổi của bạn</label>
<input id="tuoi" placeholder="Nhập tuổi"> <br>
<input type="button" onclick="xemTuoi()" value="GỬI">
<script>
function xemTuoi(){
var tuoi = document.getElementById('tuoi').value;
alert("Bạn "+tuoi+" tuổi!");
}
</script>

Chạy Thử

Sự kiện click() không gán trực tiếp trong JavaScript

xemtuoi.addEventListener('click', function() {
alert("Bạn "+tuoi+" tuổi!");
});

<label for="tuoi">Nhập tuổi của bạn</label>
<input id="tuoi" placeholder="Nhập tuổi"> <br>
<input type="button" id="xemtuoi"  value="GỬI">
<script>
var xemtuoi = document.getElementById('xemtuoi');
xemtuoi.addEventListener('click', function() {
var tuoi = document.getElementById('tuoi').value;
alert("Bạn "+tuoi+" tuổi!");
});
</script>

Chạy Thử

Sự kiện click() vào class trong JavaScript

$(".sanpham").click(function() {
  alert("ID Sản phẩm là: "+id);
});

<div class="sanpham" data-id="1" >Clilck để lấy ID SẢN PHẨM: 1</div>
<div class="sanpham" data-id="2" >Clilck để lấy ID SẢN PHẨM: 2</div>
<div class="sanpham" data-id="3" >Clilck để lấy ID SẢN PHẨM: 3</div>
<script src="https://webmoi.vn/media/js/jquery-3.6.0.js"></script>
<script>
$(".sanpham").click(function() {
  var id = $(this).attr("data-id");
  alert("ID Sản phẩm là: "+id);
});
</script>

Chạy Thử

Lời kết

Cảm ơn các bạn đã tham khảo bài viết Sự kiện click() trong JavaScript.