Question

我有一个非常具体风格化的<ul><li><a>结构，有9个元素，分为3列。我想在没有制作第4列的情况下添加另一个项目，所以我正在考虑的解决方案是在一个'插槽'中有2个链接。

问题在于<ul><li><a>的结构使得添加<a>会自动创建另一个广告位（垂直）。

我希望不必从头开始重新创建整个结构以适应这种变化，所以我试图想出一个黑客。

我知道这是丑陋的，但它确实会造成至少一个有趣的问题......

我尝试过：

<a href="link1.html">link1 <span onclick="location.href ='link2.html'">link2</span></a>

但这不起作用 - 我也尝试过使用jQuery，但这也没有用。这里有解决方法/黑客攻击吗？还是我必须重组整个列表？

Answer 1

这是让a和span元素带您到不同链接的快捷方式。（我注释掉了实际链接并改为使用警报，因为无论如何链接都不会加载到框架中。）

function goToLink(e, that) {
  e.stopPropagation();
  if (that.tagName.toUpperCase() == "A") {
    // if anchor was clicked
    alert("1st link");
    //window.location.href = "http://www.google.com";
  }
  else {
    // if span was clicked
    alert("2nd link");
    //window.location.href = "http://www.yahoo.com";
    
  }
}

<a href="#" onclick="goToLink(event, this);">link1 <span onclick="goToLink(event, this);">link2</span></a>

stopPropagation()调用可防止在单击第二个链接时加载第一个链接。

Answer 2

＆＃13;

$('#link2').click(function() {
  window.setTimeout(function() {
    location.href = $('#link2').attr('data-href')
  }, 10)
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href="link1.html">link1 <span id='link2' data-href="link2.html">link2</span></a>

＆＃13;

2个锚点中的链接

2 个答案: