SIR
목록으로
이전글 다음글

선택자 하이퍼링크 자바로 바꾸기 채택완료

아기상어뚜루
프로필 보기이 회원 글보기이 회원의 댓글보기
 2년 전 조회 2,289
답변 2
목록

<div class="swiper-slide><a href="https://www.naver1.com/">버튼1</a></div>

<div class="swiper-slide><a href="https://www.naver2.com/">버튼2</a></div>

<div class="swiper-slide><a href="https://www.naver3.com/">버튼3</a></div>

<div class="swiper-slide><a href="https://www.naver4.com/">버튼4</a></div>

<div class="swiper-slide><a href="https://www.naver5.com/">버튼5</a></div>

<div class="swiper-slide><a href="https://www.naver6.com/">버튼6</a></div>

이 부분이 템플릿으로 되어있어서 수정이 불가능해서

스크립트로 링크를 바꾸려고 하는데 맞게 한것 같은데

적용이 잘 안되는데 뭐가 틀렸나요? 클릭했을때 이동이 되어야합니다~

<style>

    .h_sec02 .swiper_top .swiper-slide:nth-child(3) {background:#000;} 
    .h_sec02 .swiper_top .swiper-slide:nth-child(3) a{color:red;} 

</style>

<script>
$(function(){
    $('.h_sec02 .swiper_top .swiper-slide:nth-child(3) a').click(function(){
          location.href = 'https://www.oliveyoung.co.kr/';
     });
});
</script>

#자바스크립트 #선택자 #링크 #nth

답변 2개

채택된 답변
+20 포인트
Copy 
$(function(){
    $('.h_sec02 .swiper_top .swiper-slide:nth-child(3) a').click(function(evt){
        evt.preventDefault();
        location.href = 'https://www.oliveyoung.co.kr/';
     });
});
로그인 후 평가할 수 있습니다

답변에 대한 댓글 1개

헉 베르만님! 알려주신대로 적용해보니 바로 작동해요! 감사합니다! 구글에서 엄청해맸던 부분인데 속이 후련하네요 ㅠㅠ 남은 하루 좋은 시간보내세요!

댓글을 작성하려면 로그인이 필요합니다.

class="swiper-slide 는 class="swiper-slide" 가 아닌가요? 따옴표가 빠진듯요.

어쨌거나 위 코드대로라면 아래처럼요.

Copy 
<div class="swiper-slide"><a href="https://www.naver1.com/">버튼1</a></div>
<div class="swiper-slide"><a href="https://www.naver2.com/">버튼2</a></div>
<div class="swiper-slide"><a href="https://www.naver3.com/">버튼3</a></div>
<div class="swiper-slide"><a href="https://www.naver4.com/">버튼4</a></div>
<div class="swiper-slide"><a href="https://www.naver5.com/">버튼5</a></div>
<div class="swiper-slide"><a href="https://www.naver6.com/">버튼6</a></div>

.

.

.

<script>
document.querySelectorAll(".swiper-slide")[1].querySelector("a").href = "https://www.oliveyoung.co.kr/";
</script>
로그인 후 평가할 수 있습니다

답변에 대한 댓글 2개

넵!맞아요! 제가 급하게 작성하다보니 따옴표가 빠졌네요;;ㅎㅎ
알려주신내용은 감사하지만 ㅠㅠ 그대로 적용해보니 작동되지가 않네요~
제가 작동여부를 확인하려고

<script>
$(function(){
$('.h_sec02 .swiper_top .swiper-slide:nth-child(3) > a').click(function(){
return false;
});
});
</script>

여기까지 시도해봤는데 아예 제어하는건 잘되는데 왜 링크 거는게 안될까요 ㅠㅠ
비타주리님! 이 문제 해결이 된것같아요!! 도움주셔서 감사합니다!
비타주리님이 주신 스크립트도 처음보는 스크립트인데 이런 부분도 알아가서
나중에 응용해볼 수 있을 것 같아요! 좋은 하루보내세용!

댓글을 작성하려면 로그인이 필요합니다.

답변을 작성하려면 로그인이 필요합니다.

로그인
🐛 버그신고