Question

大家好我想知道是否有任何解决方案可以选择一个href来做某事而不重复或在一个href中给出任何类或id。例如：

<ul>
  <li><a href="google.com">google</a><li>
  <li><a href="yahoo.com">yahoo</a><li>
  <li><a href="facebook.com">facebook</a><li>
</ul>

并在jquery中：

$(function(){
  $('li a').on('click', function(){
    console.log('open google.com');
    console.log('open yahoo.com');
    console.log('open facebook.com');
  });
});

Answer 1

在引用的事件处理程序中，您可以像这样访问所点击元素的href：

console.log($(this).attr("href"));

如果hrefs格式正确（它们不在问题中），您可以使用：

console.log(this.href);

获取完全解析的版本。

在任何一种情况下，为防止浏览器尝试关注该链接，请使用该功能中的e.preventDefault()或return false（这两者都会阻止dfeault并停止传播）。

直播示例：

$(function(){
  $('li a').on('click', function() {
    snippet.log($(this).attr("href"));
    return false;
  });
});

<ul>
  <li><a href="google.com">google</a><li>
  <li><a href="yahoo.com">yahoo</a><li>
  <li><a href="facebook.com">facebook</a><li>
</ul>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

或者使用正确形式的链接：

$(function(){
  $('li a').on('click', function() {
    snippet.log(this.href);
    return false;
  });
});

<ul>
  <li><a href="http://google.com">google</a><li>
  <li><a href="http://yahoo.com">yahoo</a><li>
  <li><a href="http://facebook.com">facebook</a><li>
</ul>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<!-- Script provides the `snippet` object, see http://meta.stackexchange.com/a/242144/134069 -->
<script src="http://tjcrowder.github.io/simple-snippets-console/snippet.js"></script>

jquery每个href应该是这样的东西

1 个答案: