Radio button trong html

#1

em đang làm một chức năng là khi chọn một trong 3 cái radio rồi click vô button show images thì nó sẽ xuất hiện các hình ảnh thuộc chủ đề đó ra cái khung nhỏ (ảnh trong máy em), vấn đề của em là làm thế nào để gán các radio với các ảnh thuộc từng chủ đề đó để mà khi mình chọn radio nào thì nó sẽ show ra khung các hình đó ạ. Em cảm ơn

taobai.png1360×618 4.51 KB

#2

cái này cần học thêm về javascript
link tham khảo
https://www.w3schools.com/js/default.asp

1 Like
#3

em có học qua js căn bản rồi anh

#4

Bắt sự kiện click cái radio button. Click vào cái nào thì lưu giá trị vào 1 biến. Lúc click button thì if else cái giá trị đấy show ảnh tương ứng.

1 Like
#5

thế trường hợp có nhiều radio button và nhiều ảnh thì làm sao bác

#6

Nói cho rõ ràng xem nào.

#7

ý e là nếu nhiều cái radio button thì chả lẽ if else hết cái đó luôn à

#8

nhiều à:

  1. Bắn sự kiện các nút đấy thông qua class css.
  2. Lấy giá trị từ sự kiện click.
  3. Tạo 1 object kết quả mapping với value của radio.
  4. Lấy ảnh thông qua cái object đấy để hiển thị.

VD:

3 nút radio có giá trị: rad1, rad2, rad3
bạn tạo 1 object:

var obj = {
    "rad1": "ảnh 1",
    "rad2": "ảnh 2",
    "rad3": "ảnh 3",
}

Giả sử lúc click vào radio get được value là rad2 thì bạn lấy giá trị ảnh: obj["rad2"]
Không phải if else nhé :slight_smile:

2 Likes
83% thành viên diễn đàn không hỏi bài tập, còn bạn thì sao?