吐槽一下，习惯了鼠标中键打开新页面，遇到一些通过 js 跳转路由的网站是真的难受，这种方案不仅 SEO 优化差，用户想开个新页面还只能手动复制链接
 |
1
murmur 5 天前
都啥年代了，现在是$EO ，不是 SEO ，而且都在做私域 APP ，以后给你做网站都是福报了
|
 |
2
wangtian2020 5 天前
开新页面不是都是拖到新窗口，或者摁住 ctrl 吗
|
 |
3
xiaoming1992 5 天前
@wangtian2020 对于 js 跳转路由的，你这些都无效。这些操作只对 a 标签有效
|
 |
4
zbqsfs 5 天前  7
作为前端开发也反感这种逻辑，自己写代码的时候都会用 a 标签实现路由跳转
|
 |
5
wlf2mydream 5 天前
@murmur 没看懂 大佬可以解释一下吗 真诚请教
|
 |
6
wunonglin 5 天前 8
这个问题只是开发人员单纯乱写，全写 div 上，正常肯定是要在 a 标签的。
|
 |
7
gogozs 5 天前
你这个要求就有点多了……
|
 |
8
spritecn 5 天前
这个应该去怪 Angular/Vue/React 这些框架吧..哈哈哈
|
|
9
murmur 5 天前
@wlf2mydream 意思就是 SEO 要给钱，再好的 SEO 不如买榜，而且现在都是 APP 时代，有人给你做网页版你就烧高香吧
|
|
10
wlf2mydream 5 天前
@murmur #9 学习了 感谢回答
|
 |
11
fzhyzamt 5 天前 1
我也很讨厌全用 click 跳转，很难用，自己写前端的时候能用<a>就用 a 标签
|
 |
13
bojackhorseman 5 天前
that's why we should use `<router-link />`
|
 |
14
weixind 5 天前
收到🫡
|
 |
15
xiaofeixiang 5 天前
不用 a 标签应该是想在跳转前执行自定义操作吧，对于需要 seo 的页面肯定是会用 a 标签的，但是现在大部分页面都是 spa ，用不着考虑 seo
|
 |
17
saltand 4 天前 via iPhone
div 一把梭的后果
|
 |
18
Al0rid4l 4 天前 4
这跟 js 跳转有啥关系, 这不纯纯写页面的人菜吗, a 标签加路由逻辑确保 GET 幂等就没这事了
|
 |
19
Pipecraft 4 天前 1
重视用户体验是前端开发人员的基本素养。
鼠标中键打开链接、鼠标右键选择链接打开方式、Tab 键遍历可点击元素等都应该考虑并实现。 很多网站/网页应用做得很烂，只能用鼠标点击，Vimium 的 f/F 快捷键用不了，很烦。 |
 |
20
lambdaq 4 天前
js 不是问题
问题是一堆写 js 的压根没正经用过浏览器。。。 |
 |
21
dfkjgklfdjg 4 天前
因为懒，直接 div 一把梭。用前端框架路由也是可以保证可以正确生成 a 链接的。
|
 |
22
cheneyzhang 4 天前 2
也有很多产品经理的奇葩需求, 点击跳转前各种检查逻辑.
|
 |
23
cst4you 4 天前
点名批评 t.bilibili.com
|
 |
24
Danswerme 4 天前
框架不背锅，以 Vue 举例，vue-router 中 router-link 标签默认就渲染的是 a 标签
|
 |
25
eod 4 天前
@cheneyzhang 赞成
|
 |
26
DOLLOR 4 天前
就是某些前端水平差呗。
一是不知道怎么消除 a 标签的默认样式。 二是不知道 <NavLink to={{pathname: '/about', search: 'name=foo&id=3'}}> 或者 <RouterLink :to="{path: './about', query: {name: 'foo', id: 3}}"> 的 to 属性是可以带参数的，只懂得用 router.push 来跳转 |
 |
29
focuxin 4 天前
第一次知道按中键可以以新页面打开，学到了
|
 |
30
Linho1219 4 天前
@spritecn 并非，现在的 SPA 框架工作逻辑都是真正的<a>标签，然后通过 JS 去拦截页面导航事件，是可以良好支持楼主的这种操作的。毕竟是基础设施，这点优化还是该做的
楼主说的是那种手写 window.open 的 |
 |
31
VagabondH 4 天前
吐槽的对，确实受不了不用 a 标签做跳转的
|
 |
34
fao931013 4 天前
我倒是喜欢用 cmd + 左键 和 cmd + w 打开关闭新页面
|
 |
36
pikko 4 天前
微博之前改版 SPA 初版，就是没法信息流里用新标签页点开一条微博。完全丧失网页浏览的高效性，做成了一个巨大的 APP 。还好后面几个小版本就修复过来了。
还得看验收，有时候这种小细节前端直接就看心情写了。 |
 |
37
drydiy 4 天前 via iPhone
前面说反感这种逻辑到底做过需求没？产品的需求是点击触发一系列逻辑处理，检查，再跳转。这种需求写多了，正常人都会忘记 a 标签。
|
 |
38
nexo 4 天前
现在主流是单页应用
|
 |
39
ghosthcp516 4 天前 3
说检查逻辑的大概率不知道什么是 preventDefault ，不然那些框架导航守卫怎么做的。平时受产品老板的气，网上看到这些心理也太不平衡了，知道得多反而变成了异类
|
 |
42
yangth 4 天前
明明是 seo 技术落后，反过来倒逼开发技术退步
|
 |
43
nullEDYT 4 天前
@ghosthcp516 preventDefault 只能同步函数 不能异步函数吧
|
 |
44
finalwave 4 天前
B 站以前还是 a 标签能中键打开，后来改成全 div 。不知道是谁的 KPI 。
|
 |
45
ruofee 4 天前
@Linho1219 常见的 SPA 路由库，比如 vue-router 和 react-router ，都是利用 History API 实现的路由切换，核心工作逻辑并非 a 标签
|
|
46
ghosthcp516 4 天前
@nullEDYT 你好，跟同步异步没关系的，为了这条回复我专门写了示例证明：aHR0cHM6Ly9wbGF5LnZ1ZWpzLm9yZy8jZU5yTlUxMXYyakFVL1N0WDNrT0NoQUpqZTJLQU5qclVNVzF0TlFwUGZqSEpCVndTTzdKdmdBcngzM2VkRk5wcFU1LzJVRVdSN1B0eGZPN3g4VkY4S2N0a1Y2SG9pNEZQblM0SlBGSlZqcVRSUldrZHdSR3MrV2tyUTVqQkNWYk9GaEJ4US9SSkdtbFNhenpCMnBKZDlPWmVtL1dpd2l1VjUwdVZibUVJeWorYUZCQ0dJemh5T1lVUGs5TGhEZzE5eFpXcWNvcGI1MHdBc3prbXVWM0gwZHFDTXBZMjZIcTk2RktpOWtvVEdOekRIUlBSSG1PSC9nOTRTY3ovWGhkb0t3ckpOcnp2ZHJzWGdOTmxsZHRVa2JZbTJUaGNNVmNwTmtTbDczYzYrLzArV1NxZFZVbHFDeW1haGxNWTk2SkVITGVlVGdYSWJGb1ZQRSt5UnBya0dKYmp4MmtXUmlBYnRSS1ZaWk13N3cvdENRMjZPRXB6blc2ajl2K1I1MDJJdzQzaEgzUWFEN0Y3ZUVOWWxMa2k1QjNBUUlIT2hsSUVVYVNBZ011N00rcXVoNGNHRUVac0p5QUxDdzVCUEo3UHZrMWJnNDRLa0RSWU91ZzBLd1dmYXhuUGNqMUIvMjNENThQZVNURzZ2bTJ3WVQ2YjNsekRZajVwc0FlZEYyeEZXNUJudVZkNm5UeDRhL2h4MURjdEJWTXNkWTd1dGd6cWVDbjZqUWRDanMreisrOTFqRnlGN1hNODNXQzYvVWY4d1I5Q1RJbzd2Z2wwTzVUaWtpUGwyRTFOZWpLN3dRT3ZMOG5DWmxYTzFhOGtmeUZicFFvY203SnhaVEttL2FLdVpqdXRuempyZGU4bkJ6YW5QdzhWaUliS1UxMHZCVC80cTFkR2Y2YjdJZmxZOTdFZnhPazNGOFdBSnc9PQ==
|
|
47
Linho1219 4 天前 via Android
@ruofee 不是一件事，History API 是管“捕获导航之后怎么切换”的问题，和用什么元素无关
比如说 vitepress 文章里面的链接都是 a 标签啊，禁用 JS 依然能 fallback 到 MPA 模式 |
 |
48
importmeta 4 天前
上网冲浪这么多年了, 才知道中键能打开新网页, 我哭了.
|
 |
49
xinzhanghello 4 天前
国内前端水平，一个字菜，再加几个字：不如 AI 。 不是技术菜，是意识
|
 |
50
dcdlove 4 天前
@importmeta 学会了
 |
 |
51
DT27 4 天前
一直觉得现在的 js 不安分，到处瞎搞。
求大神们收了神通吧。 |
 |
53
bowencool 4 天前
@cheneyzhang #22 e.altKey 、e.metaKey 了解一下
|
 |
55
LandCruiser 4 天前 2
@bowencool 太细了哥，但我不会这么干，我的工资不允许我考虑这么细。
|
 |
56
iv8d 4 天前 via Android
国内环境不错，以后所有的都需要登陆才能获取优质内容
|
 |
57
simo 4 天前
收藏帖子的兄弟们，是准备后面看乐子么？
|
 |
58
alading11 4 天前
我去，发现新大陆了，原来鼠标中键可以直接新标签打开？！
|
 |
59
JCZ2MkKb5S8ZX9pq 4 天前
用 vimnium 的碰到这种不规范的用法的确很困扰。
不用 a/button ，不写 role 。有些甚至连 cursor 都不处理。 |
 |
60
frankies 4 天前
国内互联网产品能做网页版都是良心企业了，你就知足吧，淘宝网页版都摆烂多少年了啊，大厂都摆烂。。。
|
 |
61
diegozhu 4 天前 via Android
@xiaofeixiang 用了 a 标签也能在跳转前做事情。。
|
 |
62
Obj9527 4 天前
这种不是菜不菜的问题，而是想不想做的问题
|
 |
63
meteora0tkvo 4 天前
youtube spa 单页应用可以实现楼主说的按住鼠标中键/ctrl/ctrl + shift 新标签页打开，不知道怎么实现的。如果是用 vue 的 route 方法跳转确实会有这个问题
|
 |
64
peasant 4 天前
@ghosthcp516 #46 打开看了下你这个例子，点击鼠标左键确实有用，但是点鼠标中键是直接打开 href 里的链接，没有执行方法。
|
 |
65
dode 4 天前
@xiaoming1992 按着 ctrl ，点击会在新窗口打开页面
|
|
66
nullEDYT 4 天前
@ghosthcp516 e.preventDefault() 需要放到 await 后面 然后根据条件判断是否执行 e.preventDefault()，然后决定是否跳转
|
 |
67
cj941030 4 天前
有时候没办法，点击按钮有一堆的判断，甚至参数获取，再去做跳转
|
 |
68
edisonwong 4 天前
中小公司，前端界面很可能都是后端人员“身兼数职”来写的，加上屁事多，所以很多压根都没这个意识与知识
给多少钱就要求那么细致开发要求体验好啊，甚至有些都不适配移动端，三折叠屏幕，全错乱 |
 |
69
Y25tIGxpdmlk 4 天前
@gorvey #32 跳转过去的目标页来验证不行吗？
|
 |
70
chanChristin 4 天前
@xinzhanghello 一棒子打死国内所有前端，还得是你。
|
|
71
xinzhanghello 4 天前
@chanChristin 哈哈 夸张了。 肯定还是有厉害的，我只是后端来吐槽下大部分页面真的很难受。
|
 |
72
gofishing 4 天前
@ghosthcp516 这样做有很大的漏洞
1. 鼠标右键, 可以打开菜单, 选择跳转. 得再阻止 contextmenu 事件. 2. 无法阻止鼠标中键新页面打开. 3. 无法阻止 ctrl + 左键打开 4. 如果测试, 产品较真起来, 鼠标 hover 到链接的时候, 页面左下角是可以看到链接, 用户可以手动输入链接跳转. |
|
73
xiaoming1992 3 天前 via Android
@dode #65 我说的是，如题所说的 js 跳转，用的是 router.push 之类的，你用 ctrl 或者中键都没用。
|
 |
74
ragnaroks 3 天前
说一个需要使用事件而不是 A 标签的正常的需求：阻止浏览器预读浪费大量带宽
|
 |
75
kakki 2 天前
我 XX 居然这么多人不知道鼠标中键能打开新链接的.
|
Select Language