链接执行 javascript 代码的正确方法

发布于 2024-09-18 18:37:22 字数 727 浏览 7 评论 0原文

我知道有 4 种主要方法可以从链接执行 javascript 代码。对于我的要求，我需要在不将屏幕移动到任何地方的情况下执行此操作（链接到 # 并且不返回 false 是不好的）。如果可能的话，对执行的 javascript 代码进行 SEO 也很重要。那么这样做的正确方法是什么？

方法 1（需要确保 myCode() 始终返回 false）：

<a href="#" onclick="return myCode();">execute</a>

方法 2（似乎最有意义？）：

<a href="javascript:myCode();">execute</a>

方法 3：

<a href="javascript:void(0);" onclick="myCode();">execute</a>

方法 4（语义上不如我认为的其他方法那么令人愉快）：

<span id="executeMyCodeLink" class="link">execute</a>
<script>
$('#executeMyCodeLink').click(myCode);
</script>

使用方法 4，您可以当然也使用 onclick ..

原文

So there are 4 main methods I'm aware of to execute javascript code from a link. For my requirements, I need to do so without moving the screen anywhere (linking to # and not returning false is bad). SEO for the executed javascript code, if possible, is important too. So what's the right way to do this?

method 1 (need to make sure myCode() returns false always):

<a href="#" onclick="return myCode();">execute</a>

method 2 (seems to make the most sense?):

<a href="javascript:myCode();">execute</a>

method 3:

<a href="javascript:void(0);" onclick="myCode();">execute</a>

method 4 (not as pleasant semantically as the others I think):

<span id="executeMyCodeLink" class="link">execute</a>
<script>
$('#executeMyCodeLink').click(myCode);
</script>

with method 4, you can use onclick as well of course..

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

屋檐 2024-09-25 18:37:24

我也更喜欢方法4。

将事件单独绑定到 dom 对象是一种更优雅的方式，我认为这是一个很好的编程习惯。

回复收藏 0 原文

娇纵 2024-09-25 18:37:24

我也喜欢方法4。只要有可能，我都会尝试不直接在 Even 属性中放入任何内容，或者直接将 js 写入 href 中。我这样做是因为在大多数情况下，我实际上会将非 js url 作为 href，因此对于非 js 启用的浏览器来说，它会降低性能。第二个原因是我不喜欢用垃圾污染元素:-)

回复收藏 0 原文

南…巷孤猫 2024-09-25 18:37:23

您使页面不跳转，并使用带有 href 的“a”标签和使用 PreventDefault 的方法 4。

<a id="executeMyCodeLink" href="#">execute</a>
<script>
  $('#executeMyCodeLink').click(function(event) {
    event.preventDefault();
    myCode();
  });
</script>

包含 href 很重要，因为否则链接的样式将无法正确，并且您的 html 将无法验证。

You make the page not jump and use an "a" tag with an href and method 4 using preventDefault.

<a id="executeMyCodeLink" href="#">execute</a>
<script>
  $('#executeMyCodeLink').click(function(event) {
    event.preventDefault();
    myCode();
  });
</script>

It's important to include an href because links won't style properly and your html won't validate otherwise.

回复收藏 0 原文