前言
最近开发一个静态公司官网,其中有四个推荐位,推荐位由图片,标题,简介组成,要求点击推荐位的任意位置皆可跳转到指定页面。
解决方式
方式一
使用 window.location.href
跳转,如下代码所示:
<div class="recommend" onclick="window.location.href='https://first.com';return false">
<img class="recommend_img" src="/images/recommend/first.png"/>
<span class="recommend_title">First</span>
<p class="recommend_desc">
第一个推荐位
</p>
</div>
return false:取消默认的事件行为,例如你给a标签增加了href,就会既执行函数也会跳转,例如:hello
方式二
使用 window.open
跳转,语法:window.open(*URL,name,specs,replace*)
参考文档,如下代码所示:
<div class="recommend" onclick="window.open('https://first.com','_self')">
<img class="recommend_img" src="/images/recommend/first.png"/>
<span class="recommend_title">First</span>
<p class="recommend_desc">
第一个推荐位
</p>
</div>
_self:代表在当前窗口打开,默认是 _blank,在新页面打开。