Untitled
html
a month ago
6.6 kB
3
Indexable
Never
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <link rel="stylesheet" href="5.css"> </head> <body> <div class="main"> <div id="slide-container"> <div class="slide"> <img src="image/banner/New folder/1.jpg"> </div> <div class="slide"> <img src="image/banner/New folder/2.jpg"> </div> <div class="slide"> <img src="image/banner/New folder/3.jpg"> </div> <div class="slide"> <img src="image/banner/New folder/4.jpg"> </div> <div class="slide"> <img src="image/banner/New folder/5.jpg"> </div> </div> <div id="controls"> <button onclick="prevSlide()">Prev</button> <button onclick="nextSlide()">Next</button> <button onclick="autoPlay()">Auuto</button> <span id="ppp"></span> <button onclick="stopPlay()">Stop</button> </div> <div id="form"> <h2>ĐĂNG KÝ KHOÁ HỌC ONLINE</h2> <label for="name">Họ tên</label> <input type="text" id="name" name="name"> <span class="thongBao"></span> <br><br> <label for="email">Email</label> <input type="text" id="email" name="email"> <span class="thongBao"></span> <br><br> <label for="phone">Số điện thoại</label> <input type="number" id="phone" name="phone"> <span class="thongBao"></span> <br><br> <label for="khoaHoc">Khoá học</label> <select id="khoaHoc" name="khoaHoc"> <option value="html">html</option> <option value="css">css</option> <option value="Javascript">Javascript</option> </select> <span class="thongBao"></span> <br><br> <label for="hocPhi">Học phí</label> <input type="text" id="hocPhi" name="hocPhi"> <span class="thongBao"></span> <br><br> <label>Hình thức học</label> <input type="radio" name="truong" value="truong" id="truong">Tại trường <input type="radio" name="online" value="online" id="online">Học online <span class="thongBao"></span> <br><br> <input type="submit" value="Đăng ký" onclick="submitbutt()"> </div> </div> </body> </html> <script> var slideIndex = 0; var slide = document.getElementsByClassName("slide"); var poin = document.getElementById("ppp"); var autoSlide; function showSlide(n) { if (n >= slide.length) { slideIndex = 0; } if (n < 0) { slideIndex = slide.length - 1; } for (let i = 0; i < slide.length; i++) { slide[i].style.display = "none"; } slide[slideIndex].style.display = "block"; var slide_position = slideIndex + 1; poin.textContent = slide_position + "/" + 5; } function nextSlide() { slideIndex++; showSlide(slideIndex); } function prevSlide() { slideIndex--; showSlide(slideIndex); } function autoPlay() { nextSlide(); autoSlide = setInterval(nextSlide, 1999); } function stopPlay() { clearInterval(autoSlide) } showSlide(slideIndex); function submitbutt() { let name = document.getElementById("name"); let email = document.getElementById("email"); let phone = document.getElementById("phone"); let khoaHoc = document.getElementById("khoaHoc"); let hocPhi = document.getElementById("hocPhi"); let truong = document.getElementById("truong"); let online = document.getElementById("online"); let regexEmail = /^[a-zA-Z0-9.!#$%&'*+/=?^_`{|}~-]+@[a-zA-Z0-9-]+(?:\.[a-zA-Z0-9-]+)*$/; let regexPhone = /^[0-9\-\+]{9,15}$/; let thongBao = document.getElementsByClassName("thongBao"); for (let e = 0; e < thongBao.length; e++) { thongBao[e].innerHTML = ""; } let flag = false; if (name.value == "" || name.value == null) { // thongBao[0].innerHTML = ""; thongBao[0].innerHTML = "Vui long dien ten"; } if (email.value == "" || email.value == null) { // thongBao[1].innerHTML = ""; thongBao[1].innerHTML = "Vui long nhap Email"; } else { if (!regexEmail.test(email.value)) { // thongBao[1].innerHTML = ""; thongBao[1].innerHTML = 'Không đúng định dạng'; } else { // thongBao[1].innerHTML = ""; thongBao[1].innerHTML = "email okw"; } } if (phone.value == "" || phone.value == null) { // thongBao[2].innerHTML = ''; thongBao[2].innerHTML = "Điền phone"; } else { if (!regexPhone.test(phone.value)) { // thongBao[2].innerHTML = ""; thongBao[2].innerHTML = "Phone ko hop le"; } else { // thongBao[2].innerHTML = ""; thongBao[2].innerHTML = "Phone okw"; } } if (khoaHoc.value == "Javascript") { // hocPhi.value = ""; hocPhi.value = `500`; } else if (khoaHoc.value == "html") { // hocPhi.value = ""; hocPhi.value = '33333' } else { // hocPhi.value = ""; hocPhi.value = '666666666'; } if (truong.checked && online.checked) { console.log('chon 1'); return thongBao[5].innerHTML = 'Chon 1 trong 2' } else if (truong.checked) { thongBao[5].innerHTML = 'truong'; } else if (online.checked) { thongBao[5].innerHTML = 'online'; } else { thongBao[5].innerHTML = 'chon lay 1 truong'; } if (!flag) { console.log("Okeeeew"); } } </script>