Как получить привязанный текст /href по клику с помощью jQuery?

Предположим, у меня есть якорь, который выглядит следующим образом

 <div class="res">
     <a href="~/Resumes/Resumes1271354404687.docx">
         ~/Resumes/Resumes1271354404687.docx
     </a>
 </div>

ПРИМЕЧАНИЕ. У якоря не будет идентификатора или класса ...

Я хочу получить href /text в jQuery onclick этого якоря.

105 голосов | спросил Chendur Pandian 16 PMpFri, 16 Apr 2010 15:05:08 +040005Friday 2010, 15:05:08

5 ответов


0

Примечание: примените класс 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());
  });
});
ответил Sarfraz 16 PMpFri, 16 Apr 2010 15:06:48 +040006Friday 2010, 15:06:48
0

Отредактировано для отражения обновления вопроса

$(document).ready(function() {
    $(".res a").click(function() {
        alert($(this).attr("href"));
    });
});
ответил GlenCrawford 16 PMpFri, 16 Apr 2010 15:09:32 +040009Friday 2010, 15:09:32
0

Без jQuery:

Вам не нужен jQuery, когда это просто сделать, используя чистый JavaScript. Вот два варианта:

  • Метод 1 - получите точное значение атрибута href:

    Выберите элемент и затем используйте .getAttribute() .

    Этот метод не возвращает полный URL, вместо этого он получает точное значение атрибута href .

     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>

Как видно из названия, вы хотите получить значение 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>
ответил Josh Crozier 15 Jam1000000amThu, 15 Jan 2015 06:07:14 +030015 2015, 06:07:14
0

Обновленный код

$('a','div.res').click(function(){
  var currentAnchor = $(this);
  alert(currentAnchor.text());
  alert(currentAnchor.attr('href'));
});
ответил rahul 16 PMpFri, 16 Apr 2010 15:08:03 +040008Friday 2010, 15:08:03
0

Alternative

Используя пример из 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);
  });
});
ответил Jacob Ashcraft 12 thEurope/Moscowp30Europe/Moscow09bEurope/MoscowWed, 12 Sep 2018 20:11:36 +0300 2018, 20:11:36

Похожие вопросы

Популярные теги

security × 330linux × 316macos × 2827 × 268performance × 244command-line × 241sql-server × 235joomla-3.x × 222java × 189c++ × 186windows × 180cisco × 168bash × 158c# × 142gmail × 139arduino-uno × 139javascript × 134ssh × 133seo × 132mysql × 132