51福利网
各种薅羊毛福利分享福利网

网页上的一个链接实现根据不同时间段对应跳转不同的链接

今天在做一个前端项目,其中有一个地方需要实现一种功能,就是网页上有一个超链接(图片/文字/按钮皆可),这个超链接需要满足一个功能:当在9:00-18点期间,点击超链的是A链接;而在这个时间段之外的,跳转的都是B链接。也就是根据时间段来判断href最终对应的链接,具体实现代码如下

51福利网
<!DOCTYPE html>
<html><head>
<script src="https://code.jquery.com/jquery-1.11.1.min.js"></script>
<script>
var date = new Date();
var hour = date.getHours();
$(document).ready(function(){
	if(hour>=9 && hour<=10){
		$("#weila").attr("href","http://www.51wuditu.com");
	}else{
		$("#weila").attr("href","http://www.51fulitao.com");
	}
});
</script>
</head>

<body>

<p><a id="weila">www.baidu.com</a></p><!--注意id这个标签,这是作为识别JS的依据-->

</body>
</html>

以上是在html里的应用,开头head前面的也可以放在JS文件里,然后调用
以上代码最重要的就是id这个标签,必须要和上面的script对应
hour>=9 && hour<=10,这一段代码中,9等于9:59,10等于10:59,所以要注意分钟数

注意引用官方js, https://code.jquery.com/jquery-1.11.1.min.js 的时候如果你网站没有开通了ssl,请使用 http://code.jquery.com/jquery-1.11.1.min.js 。以免有些手机浏览器出现不跳转情况

赞(0) 打赏
51福利网薅羊毛福利具有时效性,如有失效,请留言
文章名称:《网页上的一个链接实现根据不同时间段对应跳转不同的链接》-51福利网
文章链接:https://www.51wuditu.com/11123
分享到: 更多 (0)

评论 抢沙发

评论前必须登录!

Hi, 请登录     我要注册

亚青文化·51福利网最新最全薅羊毛,现金红包线报网

51联盟线报群赚钱·合作·帮助

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏