首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >如何使用jQuery在点击时获取锚文本/href?

如何使用jQuery在点击时获取锚文本/href?
EN

Stack Overflow用户
提问于 2010-04-16 19:05:08
回答 5查看 346.7K关注 0票数 116

假设我有一个锚点,如下所示

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

注意:锚点将不会有任何id或类...

我要在该锚的jQuery onclick中获取href/text。

EN

回答 5

Stack Overflow用户

回答已采纳

发布于 2010-04-16 19:06:48

注意: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());
  });
});
票数 251
EN

Stack Overflow用户

发布于 2010-04-16 19:09:32

进行了编辑,以反映对问题的更新

$(document).ready(function() {
    $(".res a").click(function() {
        alert($(this).attr("href"));
    });
});
票数 6
EN

Stack Overflow用户

发布于 2015-01-15 11:07:14

不使用jQuery:

当使用纯JavaScript完成这项工作非常简单时,您并不需要jQuery。这里有两个选项:

  • Method 1-检索href 属性的确切值:

选择元素,然后使用.getAttribute()方法。

此方法不返回完整的URL,而是检索href属性的精确值。

var锚= document.querySelector('a'),url = anchor.getAttribute('href');警告(Url);

URL 2-检索完整的

  • Method路径:

选择该元素,然后只需访问href property

此方法返回完整的URL路径。

在本例中:http://stacksnippets.net/relative/path.html.

var锚= document.querySelector('a'),url = anchor.href;警告(Url);

正如您的标题所暗示的,您希望在单击时获得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>

票数 4
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/2652372

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档