2017-05-24 3 views
0

웹 페이지를 통해 실행되고 href 속성을 찾지 만 응용 프로그램을 만들려고하고 있습니다.하지만 지금은 href 속성을 찾고 링크에 대해 경고하고 싶습니다.각 클래스 내에서 href 속성을 어떻게 찾을 수 있습니까?

나는 JQuery와 새로운 오전,하지만 난 바이올린을 통해 다음을 실행하는 것을 시도했다,하지만 난 그것을 실행 얻이 수없는 것 :

$('soundTitle__tag sc-tag sc-tag-small').on("click", function() { 
 
     var self = $(this); 
 
     var link = self.find("a").attr('href'); 
 
     alert(link); 
 
    })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="link-redirect"> 
 
     <div class="soundTitle__tagContainer"> 
 
     <a class="soundTitle__tag sc-tag sc-tag-small" href="/home">1</a> 
 
     </div> 
 
     <div class="soundTitle__tagContainer"> 
 
     <a class="soundTitle__tag sc-tag sc-tag-small" href="/home">2</a> 
 
     </div> 
 
</div>

+3

'$ ('. soundTitle.sc-tag.sc-tag-small')'누락 됨'. 또한 의미 사이의 공백 사이에 공백이 없음 – guradio

+1

셀렉터가 클래스가 아닌 요소를 검색하고 – empiric

+3

자체가 이미 태그입니다 . 따라서 내부에 ("a")를 찾을 수 없습니다. –

답변

5
<div class="link-redirect"> 
    <div class="soundTitle__tagContainer"> 
    <a class="soundTitle__tag sc-tag sc-tag-small" href="/home"></a> 
    </div> 
    <div class="soundTitle__tagContainer"> 
    <a class="soundTitle__tag sc-tag sc-tag-small" href="/home"></a> 
    </div> 

당신이 클릭 할 때 soundTitle__tagContainer 가장 가까운 앵커 태그를 찾습니다.

$('.soundTitle__tagContainer').on("click", function() { 
     var self = $(this); 
     var link = self.find("a").attr('href'); 
     alert(link); 
    }) 
세 class.Or 그냥

event.preventDefault(); 사용이 앵커 tag.This의 기본 동작을 perventing에 대한 방지 할 수 클래스 요소를 선택하는 $('.soundTitle__tag') .Use .className을 wirte와 같은

1

$('.soundTitle__tag.sc-tag.sc-tag-small') 쓰기는 당신의 선택은 앵커 태그의 경우 URL을

$('.soundTitle__tag.sc-tag.sc-tag-small').on("click", function(event) { 
 
     event.preventDefault(); 
 
     var self = $(this); 
 
     var link = self.attr('href'); 
 
     alert(link); 
 
    })
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="link-redirect"> 
 
     <div class="soundTitle__tagContainer"> 
 
     <a class="soundTitle__tag sc-tag sc-tag-small" href="/home">Link-1</a> 
 
     </div> 
 
     <div class="soundTitle__tagContainer"> 
 
     <a class="soundTitle__tag sc-tag sc-tag-small" href="/home">Link-2</a> 
 
     </div> 
 
</div>

1

$(function(){ 
 
    $('.soundTitle__tag.sc-tag.sc-tag-small').on("click", function(e) { 
 
    e.preventDefault(); 
 
    var link = $(this).attr('href'); 
 
    alert(link); 
 
    }) 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="link-redirect"> 
 
    <div class="soundTitle__tagContainer"> 
 
    <a class="soundTitle__tag sc-tag sc-tag-small" href="/home">link 1</a> 
 
    </div> 
 
    <div class="soundTitle__tagContainer"> 
 
    <a class="soundTitle__tag sc-tag sc-tag-small" href="/home">link 2</a> 
 
    </div>
다음의 링크 어떤 사람들은 지적

는 클릭 처리기에 링크 될 것입니다. 또한 스크립트와 DOM 간의 더 강력한 결합을 생성하므로 자세한 설명자를 필요로하지 않을 수도 있지만 데모 용으로 (클래스 선택기를 추가하여) 그대로 유지했습니다.

0
$('.link-redirect a').each(function() { 
    var $href = $(this).attr('href'); 
    if ($(this).is([href="/home"]) { 
    alert($href); 
    } 
}); 

다음을 확인하십시오 :) 도움이 될 수 있습니다.

작동하지 않는 경우 성명 경우 단지 변경 :

$href 

어떤없이이 blablabla을 가지고 있습니다. 작동하는 경우 대답하십시오.