Question

我有一个a标签，它包装并在其中包含一些内容。单击该框后，它将重定向到其他页面。同时，我在input type="button"包装器中有a元素。点击后，此button必须重定向到单独的页面。

到目前为止，我已经尝试了一些jquery方法，所有这些方法均导致我失败。

我在这里形成了示例结构。

$(".wrapper").click(function(e) {
  if (e.target.className == "btn") {
    e.preventDefault();
    var link = $(this).find(".btn").attr('data-link');
    console.log(link);
    //window.location.href = link;
  }
});

a.wrapper {
  display: inline-block;
  height: 100px;
  width: 100px;
  border: 1px solid #333;
  background: #ddd;
  text-align: center;
}

a.wrapper * {
  display: inline-block;
  padding: 5px;
  margin: 3px;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="google.com" class="wrapper">
  <span>some content</span>
  <input type="button" class="btn" value="click me" data-link="yahoo.com" />
</a>

当我点击a时如何防止点击button标签？

Answer 1

我不明白您的目标？ a是文本链接，而按钮是HTML元素，都将ya发送到某个地方。为什么在世界上您会将它们混合在一起？如果您认为需要使用.wrapper，则需要了解CSS通常更好，更专业。 btn的类太通用了，以至于许多网络开发人员都会用它来设计整个品牌，然后为每个带有ID的添加风味如果确实是一个特殊的按钮，请尝试在CSS中使用#id。

>>> df.to_dict('index')
{0: {'label': 1.0, 'x': 1.0, 'y': 3.0}, 1: {'label': 1.0, 'x': 4.0, 'y': 2.0}, 2: {'label': 2.0, 'x': 5.0, 'y': 5.0}}

CSS添加

<form>
<a href="https://www.google.com" class="wrapper"><span>some content</span></a>
<button type="submit" class="btn" id="special_button" formaction="https://www.yahoo.com" >
</form>

单击子元素（输入）时防止父Click（a）事件

1 个答案: