html，点击链接后停顿几秒再进入超链接，用啥函数因为css按钮有个动画，想让他显示完了再进入

Posted 2023-04-27

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了html，点击链接后停顿几秒再进入超链接，用啥函数因为css按钮有个动画，想让他显示完了再进入相关的知识，希望对你有一定的参考价值。

给这个链接加一个点击触发的事件，然后在重定向的时候用
HTML DOM setTimeout() 方法
至于停顿的时间，可以比动画时间长一点追问

能不能详细一点，我现在就是用了一个a href=，具体怎么加进去呢

追答

不用href 用onclick事件

function timedMsg()

var t=setTimeout("alert('5 seconds!')",5000)

追问

我是这样的一个css样式，怎么插进去

追答

楼下那个哥们的回答正好适合你，直接把href=“##”加个onclick
之后再加个JS 的 function

追问

function后面那一段要放在哪里

追答

你在标签里加完onclick事件后
在最后面，前加

function go()
setInterval ("doSomething()", 5000);

function doSomething()
window.location.href=www.baidu.com

这样就会在点击标签后触发go()函数，go()又会在5000毫秒后触发dosomething()函数，实现跳转

追问

不好意思哦，我再问下，我已经加入进去那句话，然后onclick也加好了，但是按钮的跳转显示为这个，不是我要跳转的地址

我先加在body里试，然后加在head里试，都不行

我发现错了

好了，解决了

参考技术A <a href="##" onclick="go()" id="test"></a>
function go()
setInterval ("doSomething()", 5000);

function doSomething()

window.location.href=www.baidu.com
追问

function后面那一段要放在哪里，地址是直接替换百度是吗

追答

把百度替换成你自己想跳转的地址

测试

function go()
setInterval ("doSomething()", 5000);

function doSomething()

window.location.href="http://www.baidu.com";

测试

如何防止超链接点击后重定向？

【中文标题】如何防止超链接点击后重定向？【英文标题】：How to prevent redirect after hyperlink click? 【发布时间】：2014-12-15 22:41:37 【问题描述】：

我有以下 html+ js 代码：

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
</head>
<body>

<a href="#" id=key onclick="func(0)">foo</a>

</body>

<script type="text/javascript">
function func(k)
    alert(1);
    return false;
   
</script>
</html>

您能解释一下如何重构以下代码，在单击 href 代码 func 后执行但 # 未添加到 URL 并且不应重新加载页面？

【问题讨论】：

***.com/questions/1265887/… 这可能就是你要找的东西 【参考方案1】：

使用javascript:void(0); 代替#，如下所示：

<a href="javascript:void(0);" id=key onclick="func(0)">foo</a>

【讨论】：

【参考方案2】：

您可以简单地删除 href 属性：

<a id='key' onclick="func(0)">foo</a>

【讨论】：

那是有效的 HTML 吗？我认为a 标签必须有href 属性。在另一张纸条上，我认为这个会在锚标签上使用cursor:text...我知道它可以在之后用css设置，只是说... 似乎在 HTML4 strict 和 HTML5 中验证良好。 @webeno 好点 - 您可以使用 cursor: pointer 使 a 标签再次使用指针光标。【参考方案3】：

改成：

                            vvvvvvv
<a href="#" id=key onclick="return func(0)">foo</a>

【讨论】：

我个人最喜欢这个 ;) 你知道为什么这个会阻止# 出现在地址行吗？ @webeno 当您在点击处理程序中返回 false 时，它会阻止默认操作发生，在超链接的情况下：转到 url（在这种情况下为 #）很好奇为什么 return function 实际上意味着默认返回 false 然后运行该函数，这是我不知道它是如何工作的简写... 因为func(0) 返回false 所以onlick="func(0)" 与onclick="false" 相同，onclick="return func(0)" 与onclick="return false" 相同 @webeno 这样想：fn = function() 1 ; alert(fn()) vs fn = function() return 1 ; alert(fn())【参考方案4】：

我想你忘记了“key”中的引号

<a href="#" id="key" onclick="func(0)">foo</a>

【讨论】：

不要认为添加引号会从链接中删除哈希...另一方面，这在 HTML 中是允许的，应该不是问题，在此处阅读更多内容（未引用属性值）：mathiasbynens.be/notes/unquoted-attribute-values 直接链接到我在之前评论中引用的网站上引用的部分：html.spec.whatwg.org/multipage/…【参考方案5】：

为了在语义上更正确，我将使用带有以下 onclick 的按钮：

<button id=key onclick="return func(0)">foo</button>

这样就无需修改 e.preventDefault / return false。

【讨论】：

按钮看起来不像链接好吧，a 标签不适合以这种方式使用。如果您想花一点额外的时间来设计按钮，这取决于您。这很容易用 CSS 修复，这意味着你的标记是有效的，你不需要制作黑客来让浏览器按照你想要的方式工作。由你决定。哦，顺便说一句，我不喜欢对我的回答投反对票，因为你懒得遵循网络最佳实践。如果你能提供这些线路，我会支持你回答这不是您原始问题的一部分，我的回答以行业最佳实践回答了您的问题。您至少可以做的就是取消反对票。【参考方案6】：

在func里面，你可以这样做：

func(event) event.preventDefault(); /* More code here! */

preventDefault 将阻止重定向，在该行之后，您可以添加任何您想要的逻辑。

但是，如果您不想重定向，建议使用button 而不是a

【讨论】：

以上是关于html，点击链接后停顿几秒再进入超链接，用啥函数因为css按钮有个动画，想让他显示完了再进入的主要内容，如果未能解决你的问题，请参考以下文章

supervisor启动一个子进程后等待几秒再启动其他子进程

使用 JavaScript 的 HTML 页面混合JavaScript 文件引用和 HTML 代码嵌入 3 种方式在 HTML 页面上打印出“点击我进入到百度首页”的超链接

点击按钮（或超链接）如何跳转到另外一个页面并执行目标页面的js函数

如何在html页面中设置超链接

c语言中怎么让程序执行完一条指令后过几秒再执行第二条指令

JSP中设置超链接失效点击进入下载页面的问题

html，点击链接后停顿几秒再进入超链接，用啥函数 因为css按钮有个动画，想让他显示完了再进入

如何防止超链接点击后重定向？

html，点击链接后停顿几秒再进入超链接，用啥函数因为css按钮有个动画，想让他显示完了再进入