Question

我有一个a元素，它具有自己的href，并且效果很好。问题是，除了一个href元素之外，我还想创建一个onClick函数，但是当我这样做时，href被忽略了：

<li><a href="#someSectionOfThePage" onClick={someFunction}>GO TO SECTION</a></li>

使用此语法，someFunction运行，但是我没有被重定向到#someSectionOfThePage。

Answer 1

这应该可以解决问题：

<li onClick={someFunction}>
   <a href="#someSectionOfThePage">GO TO SECTION</a>
</li>

当您单击<li>时，它将执行功能...，而当您单击<a>时，它将处理href。由于您将单击此元素，因此两者将同时工作。

Answer 2

标签中存在的href由于onClick事件而无法正常工作。单击元素后，它执行someFunction()，而不是将您重定向到页面的该部分。您可以尝试添加 location.href = "#someSectionOfThePage" 到someFunction()来完成href的工作。

Answer 3

您还可以尝试为click event添加一个li处理程序，并确保li和定位标记a采用相同的width。

Answer 4

尽管不建议这样做，但是如果您仍然想同时使用两者，那么就可以达到目的：

someFunction= ()=>{
  window.location.href("#someSectionOfThePage");
  //do your onClick stuff here
};

<li>
  <span onClick={this.someFunction}>GO TO SECTION</span>
</li>

希望这会有所帮助！

如何使onClick和href协同工作？

4 个答案: