프로그래밍

프론트엔드는 왜 갈수록 이거 저거 싹다 가져다 붙이는 이유를 알것다

뇌는 놔두면 썩으므로
10년전의 나를 돌아보는 마음으로
남이 볼때는 보잘것 없어도 나름 삽질해서 배운 지식들 안 잃어버리게 간단한 웹사이트를 만들고 있다.


기왕 만드는거 순수 js로만 만들어 보자 싶었음.

react? vue? 그런건 계집이나 어린아이가 쓰는 것.
상남자라면 바닐라지.
"프레임워크 쓰면 게이"라는 오만한 생각으로 시작함.

그리고 만들다가 뭔 시발 라디오 버튼 토글 기능 하나 순수 js로 구현하는데 개좆토나오는줄 알았다. 

 

이게 무슨 쌉소리인가 할텐데


내가 구현 하려고 했던 기능은 아주 간단하다.

<input type="radio" name="group_btn" id="sex1"><label for="sex1">섹</label>
<input type="radio" name="group_btn" id="sex2"><label for="sex2">스</label>
<input type="radio" name="group_btn" id="sex3"><label for="sex3">킹</label>

 

섹 스 킹

 

대충 이런 라디오 버튼들이 있다 치면 

라디오 버튼 눌렀던거(checked) 다시 클릭하면 체크 해제 되는 아주아주 기본적이고 간단한 기능임

아 그럼 대충 아래와 같이 간단하게 짜면 되겠구나.

document.querySelectorAll('input[type="radio"]').forEach(function(radio) {
  radio.addEventListener('click', function() {
    if (this.checked) {

      console.log('체크해제');
      this.checked = false;
    } else {
      console.log('체크');
      this.checked = true;
    }
  });
});

ㅇㅇ 안되

이게 뭔 시벌 개소리냐 이게 왜 안되냐.
시발 나도 모름 안됨.


콘솔 로그 찍어보면 무조건 버튼 클릭시 라디오버튼.checked의 값이 true만 나온다 
chatgpt 깡통대가리년은 헛소리만 하고 왜 안되는지 모름

결국 스택오버플로우에서 답을 찾아냄

https://stackoverflow.com/a/54382781


라디오 토글 구현한 js 코드 : https://codepen.io/RiverRockMedical/pen/VgvdrY

소스를 보자마자 랄부가 탁 처지면서 이마가 지끈거리더라.

이런 예 말고도 커밍아웃 마려운 별 병신같은 문제 많더라.

역시 사람은 주제를 알아야된다고
만약 다음에 사이트 만들일이 있으면 
분수에 맞게 온갖 라이브러리와 프레임워크 떡칠해서 퀴어축제를 열어야 겠다.

9개의 댓글

그럴땐 체크박스와 라벨을 쓰고 체크박스 디자인을 라디오버튼 모양으로 바꾸는 트릭을 쓰기도함

0
@저소음흑축써주세요제발

근데 라디오 버튼은 선택지 중 하나는 무조건 필수일 경우에 쓰는 느낌으로 접근해야함 해제가 필요한 경우엔 체크박스를 쓰는게 의미적으로 맞는걸로앎

0
2024.01.07

니가 원하는건 체크박스인데 왜 라디오를 쓰니

알맞은 ui ux를 쓰자

1
2024.01.07

역사는 반복된다

 

바닐라씀 - 어 이거 너무 반복되고 불편한데? - 라이브러리 완성 - 이 라이브러리도 너무 중구난방으로 사용하니 틀을 만들어보자 - 프레임워크 완성 - 프레임워크에 기능이 부실해서 다른 라이브러리랑 섞어서 씀 - 모든 기능을 프레임워크에 넣어보자 - 혼종완성 - 이럴바엔 그냥 순수한 api쓰고말지 - 바닐라씀 - 반복

3
2024.01.07

씹게이 ㅋㅋㅋㅋㅋㅋ

0
2024.01.07

체크박스 모르니

0
2024.01.07

저정도는 react 나 vue 에서도 쓰이고, 작동안할코드이긴해..

0
2024.01.07

그거랑 바닐라랑은 상관없어보임

0
2024.01.07

솔직히뭔소린지모르겠는데 백엔드가 이것저것 더 많이붙임

0
무분별한 사용은 차단될 수 있습니다.
번호 제목 글쓴이 추천 수 날짜 조회 수
5706 [프로그래밍] 아니 시바 이게 무슨일이야 3 인간지표 0 8 시간 전 147
5705 [프로그래밍] 아두이노 키트 아무것도 모르고 사도 될까? 6 그것 0 12 시간 전 184
5704 [프로그래밍] 횽들 Vimeo에 올라가있는 동영상의 원본크기를 확인할 수 있... 5 카뜨만두 0 15 시간 전 135
5703 [프로그래밍] c# 이벤트와 델리게이트 13 RX7900XTX 0 3 일 전 282
5702 [프로그래밍] Aws 람다에 파이썬 올려서 결과 받아오는데 11 아르피쥐 0 5 일 전 294
5701 [프로그래밍] 마리아DB mediumtext 그냥 쓰고 싶은데 21 잉텔 0 5 일 전 209
5700 [프로그래밍] 안드로이드 씹뉴비 질문이요 2 집에가게해줘 0 5 일 전 119
5699 [프로그래밍] c언어 7년했는데 이런게 되는거 처음알았음.. 4 케로로중사 0 6 일 전 805
5698 [프로그래밍] 파이썬 1도 모르는데 GPT로 프로그램 뚝딱 만듬 2 푸르딩딩 1 10 일 전 676
5697 [프로그래밍] 담주 면접잡혔는데 8 삐라루꾸 0 10 일 전 432
5696 [프로그래밍] 아두이노 부트로더를 구웠는데.. 4 렙이말한다ㅡ니가옳다 0 10 일 전 229
5695 [프로그래밍] IOS 개발자 있나여? 1 g4eng 0 13 일 전 248
5694 [프로그래밍] 시스템 디자인 인터뷰 준비 도움좀!!! 1 Nognhyup 0 13 일 전 196
5693 [프로그래밍] 최근에 vscode 쓴 사람 도움! 3 172102 0 14 일 전 483
5692 [프로그래밍] 책을 또 사버리고 말았다... 1 찰나생멸 2 15 일 전 472
5691 [프로그래밍] 윈도우 부팅화면 봐주실분 1 바나나맛두부 0 17 일 전 235
5690 [프로그래밍] 아 시발 퇴사마렵다 9 인간지표 0 18 일 전 628
5689 [프로그래밍] C#이 ㅈ사기 언어인 이유 19 ye 6 19 일 전 1224
5688 [프로그래밍] 요즘 모바일 개발은 어떤 걸 사용하나요? 14 커피좋아용 0 21 일 전 559
5687 [프로그래밍] 취준생 안드로이드 팀플 주제 머할까요... 8 조강현 0 22 일 전 295