2 글 보임 - 1 에서 2 까지 (총 2 중에서)
-
글쓴이글
-
2022년 11월 24일 21:02 #55481
김서경참가자<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Bootstrap demo</title> <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-Zenh87qX5JnK2Jl0vWa8Ck2rdkQ2Bzep5IDxbcnCeuOxjzrPF/et3URy9Bv1WTRi" crossorigin="anonymous"> <link href="main.css" rel="stylesheet"> </head> <body>
<div class="black-bg"> <div class="white-bg"> <h4>로그인하세요</h4> <form action="success.html">
<div class="my-3"> <input type="text" class="form-control" id="email"> </div> <div class="my-3"> <input type="password" class="form-control" id="password"> </div> <button type="submit" class="btn btn-primary" id="send">전송</button> <button type="button" class="btn btn-danger" id="close">닫기</button> </form> </div> </div>
<script>
document.getElementById('send').addEventListener('click', function(){ if(document.getElementById('email').value == ''){alert('아이디를 입력하세요');} else if(document.getElementById('password').value == ''){ alert('비밀번호를 입력하세요');} else if(document.getElementById('password').value.length < 6 ){alert('더 길게 입력하세요');} })</script>
<nav class="navbar navbar-light bg-light"> <div class="container-fluid"> <span class="navbar-brand">Navbar</span> <span class="badge bg-dark" id="">Dark 🔄</span> <button class="navbar-toggler" type="button"> <span class="navbar-toggler-icon"></span> </button> </div> </nav>
<script> // var 나이 = 20; // var 이름 = "kim"; // var 변수 = html요소도가능 //변수 만드는 법: var 변수이름 = 변수에넣을값;
var count = 0; $('.badge').on('click', function(){ count = count + 1 }) // count++; / count+=1; / count = count +1; 은 모두 같은 의미의 표현이다. </script><ul class="list-group">
<li class="list-group-item">An item <li class="list-group-item">A second item <li class="list-group-item">A third item <li class="list-group-item">A fourth item <li class="list-group-item">And a fifth one
<div class="main-bg"> <h4>Shirts on Sale</h4> <button id="login" class="btn btn-danger">로그인</button> </div>
<script> document.getElementById('login').addEventListener('click', function(){ document.getElementsByClassName('black-bg')[0].classList.add('show-modal'); }) document.getElementById('close').addEventListener('click', function(){ document.getElementsByClassName('black-bg')[0].classList.remove('show-modal'); }) document.getElementsByClassName('navbar navbar-light bg-light')[0].addEventListener('click', function(){ document.getElementsByClassName('list-group')[0].classList.toggle('show'); }) </script> <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.2.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-OERcA2EqjJCMA+/3y+gxIOqMEjwtxJY7qPCqsdltbNJuaOe923+mo//f6V8Qbsw3" crossorigin="anonymous"></script> <script src="https://code.jquery.com/jquery-3.6.1.min.js" integrity="sha256-o88AwQnZB+VDvE9tvIXrMQaPlFFSUTR+nldQm1LuPXQ=" crossorigin="anonymous"></script> </body> </html> 위대로 코드를 작성하였는데, 1. 다크버튼이 전혀 클릭커블 하지 않습니다. (누르기가 안됨) 2 .$('.badge').on('click', function(){count = count + 1}) 부분이 Uncaught ReferenceError: $ is not defined 라고 표시됩니다. 도움 주실 수 있을까요 ㅠ.ㅠ -
글쓴이글
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
- 답변은 로그인 후 가능합니다.