Giả sử sau đây là danh sách thả xuống của chúng tôi (chọn) -
<select onchange="selectedSubjectName()" id="subjectName"> <option>Javascript</option> <option>MySQL</option> <option>MongoDB</option> <option>Java</option> </select>
Sau đây là mã để hiển thị giá trị đã chọn trên Bảng điều khiển -
Ví dụ
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initialscale=1.0">
<title>Document</title>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fontawesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<select onchange="selectedSubjectName()" id="subjectName">
<option>Javascript</option>
<option>MySQL</option>
<option>MongoDB</option>
<option>Java</option>
</select>
<script>
function selectedSubjectName() {
var subjectIdNode = document.getElementById('subjectName');
var value =
subjectIdNode.options[subjectIdNode.selectedIndex].text;
console.log("The selected value=" + value);
}
</script>
</body>
</html> Để chạy chương trình trên, hãy lưu tên tệp “anyName.html (index.html)” và nhấp chuột phải vào tệp. Chọn tùy chọn “Mở bằng Máy chủ Trực tiếp” trong trình chỉnh sửa Mã VS.
Đầu ra
Điều này sẽ tạo ra kết quả sau -
Bây giờ, tôi sẽ chọn Java. Ảnh chụp nhanh như sau -
Sau đó, tôi sẽ chọn MongoDB. Ảnh chụp nhanh như sau -
