inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

페이스북 클론 - full stack 웹 개발

ajax란? 강의 내용 중 toggle

163

s2chuu

작성한 질문수 1

1

classList.toggle이 안됩니다.

toggle('active', true)로 하면 like에 active가 붙어서 이미지가 잘 변하는데 toggle('active')는 안 되네요. 클릭해도 이미지가 변경되지 않아요.

- IDE : webstorm 

- Browser : 크롬 버전 85.0.4183.83(공식 빌드) (64비트)

function delegation(e) {
        //타겟 : 클릭한 대상을 가져오기 e.target, e = 이벤트 객체
        let elem = e.target;
        while(!elem.getAttribute('data-name')){
            elem = elem.parentNode;
            if(elem.nodeName === 'BODY'){
                elem = null;
                return;
            }
        }
        if(elem.matches('[data-name="like"]')) {
            elem.classList.toggle('active');
}
.contents .btn_container .like-btn.active span{
    background: url("../imgs/bg05.png")no-repeat 0 -422px;
}

이상입니다.

django linux HTML/CSS javascript python 클론코딩

답변 1

1

범쌤

안녕하세요 s2chuu님  kindtiger입니다 :)

먼저, 답변이 늦어진점 대단히 죄송합니다 ㅠㅠ..

자바스크립트의 classList.toggle은 2개의 인자를 받습니다. 

마지막 인자에 true or false를 받고, 적지않으면 암묵적으로 클래스가 들어가면 true 빠졌다면 false를 반환해 스위치처럼 토글이 가능한 형태입니다. 

toggle('active', true) 로 작성하셨다면 한번 넣었을때는 들어가나 그 다음 클릭에서는 빠지지 않을것으로 예상이 됩니다.

위 코드만을 보고 문제를 확인할 순 없으나, 

toggle('active')만 했는데, 작동이 안될 경우엔 자바스크립트 코드에 문제가 있을것으로 예상됩니다.

전체 코드를 깃헙으로 공유해주시면 확인 후 답변 드리도록 하겠습니다~ 

전체 코드는 어떻게 얻을 수 있을까요?

0

325

0

게시물 만들기 부분이 이상해요..

0

213

0

footer가 수정이 안된다는 걸 이해를 못하겠어욤

0

234

0

"제주에 나만에 가게를 차리고 싶어요 3" 코드가 예제소스에 없어요

0

253

1

연습문제 - 확률 주피터에 없어요

0

265

0

영상이 짤려 있네요 - 6회차 - 코로나 Data 분석(성별, 나이)

0

152

0

javascript의 remove에 대해 문의 드려요

0

182

0

ajax의 prepend를 왜 하는 건지 알고 싶어요

0

176

0

def nickname(request, post): post에 대해 질문 드립니다

0

148

0

UserCreationForm.Meta.fields + ('email',)를 해주는 이유가 무엇인지 알고 싶습니다.

0

264

0

admin add 에서 post 선택이 헷갈리는 문제

0

148

0

북마크 에러.

0

230

1

테스트서버

0

279

0

채팅구현

1

249

0

에러 질문드립니다.

1

408

3

13:09 alert 출력

0

362

1

type 'PosixPath' is not iterable 에러

0

1426

1

8분쯤, uwsgi -i .config/uwsgi/uwsgi.ini

0

266

1

uwsgi --http :80 --home /workspace/djangomtv/venv --chdir /workspace/djangomtv --static-map /static=/workspace/djangomtv/staticfiles/ -w djangomtv.wsgi

0

189

0

1분 20초경 질문입니다

0

142

0

00:54 전부 주석처리 하는 단축키가 먼가요?

0

1997

2

git remote add 입력시 에러가 뜹니다.

0

170

1

vscode 사용중이라, bitnami 설치해서 해봤는데 업데이트가 안되요!

0

265

1

맥에서의 연결법도 올려주셨으면 좋겠어요!

0

173

1