Как получить якорный текст/href при нажатии с помощью jQuery?
считай, у меня есть якорь, который выглядит так
<div class="res">
<a href="~/Resumes/Resumes1271354404687.docx">
~/Resumes/Resumes1271354404687.docx
</a>
</div>
Примечание: не будет никакого id или класса для якоря...
Я хочу получить либо href / text в jQuery onclick
это якорь.
5 ответов
Примечание: применить класс 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());
});
});
.
Обновление На Основе Вопроса Edit
теперь вы можете получить их так:
для 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, когда это так просто сделать, используя чистый JavaScript. Вот два варианта:
-
метод 1 - получить точное значение :
выберите элемент, а затем использовать
.getAttribute()
метод.этот метод делает не верните полный URL-адрес, вместо этого он получает точное значение .
var anchor = document.querySelector('a'), url = anchor.getAttribute('href'); alert(url);
<a href="/relative/path.html"></a>
-
Метод 2-получить полный путь URL:
выберите элемент, а затем просто получить доступ к
href
свойства.этот метод возвращает полный URL-адрес.
в этом случае:
http://stacksnippets.net/relative/path.html
.var anchor = document.querySelector('a'), url = anchor.href; alert(url);
<a href="/relative/path.html"></a>
As ваше название подразумевает, что вы хотите получить href
значение на кнопку. Просто выберите элемент, добавьте прослушиватель событий click, а затем верните 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);
});
});