3일차

그루트·2021년 9월 18일
0

로그인
회원가입이랑 로그인 페이지를 만드는데 각 페이지에 맞게 사용하지 않는건 감추고 사용하는건 보이게하는 형식으로 만든다.
id값과 class값을 줘서 버튼 값에 함수를 줘서 하는데 그렇게 하면 일일이 다해줘야는데
.toggleClass를 이용해서 이를 간단하게 할수있다.

ex) function toggle_sign_up() {
("#sign-up-box").toggleClass("is-hidden")("#div-sign-in-or-up").toggleClass("is-hidden")
("#btn-check-dup").toggleClass("is-hidden")("#help-id").toggleClass("is-hidden")
("#help-password").toggleClass("is-hidden")("#help-password2").toggleClass("is-hidden")
}

로그인과 비밀번호는 정규 표현식이있다

ex) function isnickname(asValue) {
var regExp = /^(?=.*[a-zA-Z])[-a-zA-Z0-9.]{2,10}$/;
return regExp.test(asValue);
}

function is_password(asValue) {
    var regExp = /^(?=.*\d)(?=.*[a-zA-Z])[0-9a-zA-Z!@#$%^&*]{8,20}$/;
    return regExp.test(asValue);
}

id
필수--> /(?=.*[a-zA-Z]) <------ /<--필수 a~z, A~Z는 꼭있어야한다.
[-a-zA-Z0-9_.] <------ 일반적인거 (가능한거설정)
{2,10}$ <------ 2자에서 10자 사이

passward
function is_password(asValue) {
var regExp = /^(?=.\d)(?=.[a-zA-Z])[0-9a-zA-Z!@#$%^&*]{8,20}$/;
return regExp.test(asValue);
}

/^(?=.*\d)  <------ \d (숫자입력)
[0-9a-zA-Z!@#$%^&*]  <------ 조건
{8,20}$/  <------ 8자에서 20까지

.focus
선택지정함수 CSS 가상선택자랑 같은 역할을 하는거같다.

로그인에 관해 계속 공부중

toggleClass
클래스명에 is-hidden을 사용해서 리뷰작성란을 보이고 안보이게 하는 기능 구현
버튼 모양도 이런식으로 구현함
확실히 그냥 공부만 하는것보다 적용시키는게 더 기억에 잘 남는거같다
강의만 듣는게아니고 그 내용을 적용시키는 쪽으로 공부 방법을 정해야겠다

profile
i'm groot

0개의 댓글