반응형
jQuery를 사용하여 클릭 시 앵커 텍스트/href를 가져오는 방법?
제게 이런 닻이 있다고 생각해보세요.
<div class="res">
<a href="~/Resumes/Resumes1271354404687.docx">
~/Resumes/Resumes1271354404687.docx
</a>
</div>
참고: 앵커의 신분이나 계급은 없습니다...
jQuery에서 href/text 중 하나를 받으려고 합니다.onclick
그 닻의
참고: 클래스 적용info_link
정보를 얻고자 하는 링크로 이동합니다.
<a class="info_link" href="~/Resumes/Resumes1271354404687.docx">
~/Resumes/Resumes1271354404687.docx
</a>
href의 경우:
$(function(){
$('.info_link').click(function(){
alert($(this).attr('href'));
// or alert($(this).hash();
});
});
텍스트의 경우:
$(function(){
$('.info_link').click(function(){
alert($(this).text());
});
});
.
질문 편집을 기반으로 업데이트
지금은 이렇게 받을 수 있습니다.
href의 경우:
$(function(){
$('div.res a').click(function(){
alert($(this).attr('href'));
// or alert($(this).hash();
});
});
텍스트의 경우:
$(function(){
$('div.res a').click(function(){
alert($(this).text());
});
});
질문에 대한 업데이트를 반영하도록 편집됨
$(document).ready(function() {
$(".res a").click(function() {
alert($(this).attr("href"));
});
});
jQuery 미포함:
순수한 자바스크립트를 이용해서 이 작업을 하는 것이 그렇게 간단하다면 jQuery가 필요하지 않습니다.다음 두 가지 옵션이 있습니다.
방법 1 - 정확한 값을 검색합니다.
href
특성:요소를 선택한 다음 메소드를 사용합니다.
이 메서드는 전체 URL을 반환하지 않고 대신 정확한 값을 검색합니다.
href
기여하다.var anchor = document.querySelector('a'), url = anchor.getAttribute('href'); alert(url);
<a href="/relative/path.html"></a>
방법 2 - 전체 URL 경로를 검색합니다.
요소를 선택한 다음 속성에 액세스하기만 하면 됩니다.
이 메서드는 전체 URL 경로를 반환합니다.
이 경우:
http://stacksnippets.net/relative/path.html
.var anchor = document.querySelector('a'), url = anchor.href; alert(url);
<a href="/relative/path.html"></a>
당신의 제목이 암시하듯이, 당신은 다음을 얻기를 원합니다.href
클릭시 값.요소를 선택하고 클릭 이벤트 수신기를 추가한 다음 반환하기만 하면 됩니다.href
위에 언급된 방법 중 하나를 사용하는 값.
var anchor = document.querySelector('a'),
button = document.getElementById('getURL'),
url = anchor.href;
button.addEventListener('click', function (e) {
alert(url);
});
<button id="getURL">Click me!</button>
<a href="/relative/path.html"></a>
업데이트코드
$('a','div.res').click(function(){
var currentAnchor = $(this);
alert(currentAnchor.text());
alert(currentAnchor.attr('href'));
});
대안
위의 Sarfraz의 예를 사용합니다.
<div class="res">
<a class="info_link" href="~/Resumes/Resumes1271354404687.docx">
~/Resumes/Resumes1271354404687.docx
</a>
</div>
href의 경우:
$(function(){
$('.res').on('click', '.info_link', function(){
alert($(this)[0].href);
});
});
언급URL : https://stackoverflow.com/questions/2652372/how-to-get-anchor-text-href-on-click-using-jquery
반응형
'IT' 카테고리의 다른 글
NodeJS/express:캐시 및 304 상태 코드 (0) | 2023.09.10 |
---|---|
외국 열쇠는 어디에 보관해야 합니까? (0) | 2023.09.10 |
각도 6 : http 통화 중 응답 유형을 텍스트로 설정하는 방법 (0) | 2023.09.10 |
팬더의 데이터 프레임에서 숫자가 아닌 행을 찾습니까? (0) | 2023.09.10 |
Oracle에서 날짜 부분만을 기준으로 두 DATE 값을 비교하는 방법은 무엇입니까? (0) | 2023.09.10 |