这是一个创建于 172 天前的主题，其中的信息可能已经有所发展或是发生改变。
比如提交表单，可以在 form 里设置 action 提交，可以设置 button 的 onclick 方法触发一个函数调用 ajax 提交，也可以使用 jquery 序列化表单的数据然后使用$.post()提交。这其中有什么规范吗，就比如大家一都都用什么方法？
47 条回复 • 2024-05-28 11:44:54 +08:00
 |
1
rookiemaster OP 或者有什么比较标准（符合开发规范）的前端或者后端项目推荐吗
|
 |
2
flytsuki 172 天前  2
果然是新人，好多年没用过 jquery 了。。。
|
 |
3
orlog 172 天前
最重要的是理解规范，想明白它为什么要规定成那样，不要盲目的墨守成规，否则会变成人力机器，最终被 AI 工具所取代
|
 |
4
xuld 172 天前
想知道规范是好事，说明有认真在学习。
不过，另一个问题是你必须要思考的，那就是”为什么需要有规范？“ 规范会告诉你，这个地方应该怎样做。 但很多地方不是简简单单遵循某个规范就可以的，而是需要随机应变的。 就像某些人总认为 jQuery 过时了，用 jQuery 的就是菜鸟。这是非常片面的。 有些场景下使用 jQuery 可能是最高效的。 最好掌握规范的方式不是去死记硬背，而是掌握每种用法的优缺点，并择优使用 ` |
 |
5
zhongerbing 172 天前
jq 应该也有封装好的表单库，多年不写 jq 都没关注过了。。
|
 |
6
rabbbit 172 天前
form action 很老了，不再推荐使用。
jQuery 现在也用的少，不过只有几个页面用用也不错。 是要开发 UI 组件库吗？ 常用的方法是监听按钮事件，阻止掉默认的 form ，使用 fetch 提交。 新人为什么会知道 form action ，还是看的资料太老了。 |
 |
7
kneo 172 天前 1
每个公司，每个项目，每个框架，每个应用场景都不一样。自己观察总结。没有捷径。
|
 |
8
orzorzorzorz 172 天前
主楼提到的，我认为是规范的各类实现。op 的问题，我会理解成对“工具好多啊，怎么选啊，有啥祖传规矩没有”的困惑。答案是工具背后能带来多少好处，这个只能看具体场景。比如已经有了成熟的 fetch 封装库，那用 ajax 就没什么好处了。
这块我理解为业务规范，还有编码规范、交互规范之类的。这些直接搜就是，但得知道这些东西的适用范围。得有“我要画个页面，那么 ui 设计的规范是啥样的...噢，想起来了有篇这个规范，我瞅瞅先”、“我要写 css 了，那么 css 变量规范是啥样的”这类的想法。 当然在这之前，还是要想想“接下来使用的规范”能带来什么收益。 |
 |
9
yuuko 172 天前
梦回 2014
|
 |
10
oamu 172 天前
这两种应该都不怎么用了，太原始了，当然维护上古项目就另说。现在基本都用组件库，使用 Form 表单组件设置回调函数就行了。
|
 |
11
Ma4cus 172 天前
啥项目啊，2024 年了还用接 q 睿
|
 |
12
coala 172 天前
应该看写好的项目， 先模仿着写
|
 |
13
DOLLOR 172 天前 4
@xuld
jquery 就是过时了，要学也应该学 DOM API 。 特别是那些在 vue react 里还非要引入 jquery 的。 小范围的 DOM 操作我不反对，但是这种场景还非要用 jquery ，就是菜鸟了。 |
 |
14
xiaoming1992 172 天前 via Android 1
re #6
> form action 很老了，不再推荐使用。 现在 react 推荐使用 form action 。 关键是理解为什么要用 form action ，它解决了什么问题？解决了“页面水合完成前，页面无法交互”这个难题。react 服务端渲染、form action 都是在致力于解决这个问题 |
 |
16
wpzz 172 天前
多看少做
|
 |
18
bzw875 172 天前
jQuery 过时了
|
 |
19
uni 172 天前
首先肯定是根据你做的那个项目来了，你做的项目别的地方是怎么做的就复制粘贴同样的做法就行了
如果是没有参考的，jq 首先要排除，用 jq 还不如用原生 dom 操作 然后不同地方不同框架的推荐方式也不一样，国内的话大部分应该还是用“设置 button 的 onclick 方法触发一个函数调用 ajax 提交”的方法，直接用这个就行了 但是最新的方向（往 ssr 走的）反而是偏向于 action ，可以去参考 remix 和 next 的文档，不过国内的人都不懂也没什么人跟进，如果你圈子在国内，对新技术又不是很好奇和激进的话不建议搞这个，在国内说这个可能会像上面那样让别人误以为你落后了 |
|
20
rabbbit 172 天前
@xiaoming1992
form action 不是会导致页面跳转吗,他们是怎么解决这个问题的?还是我记错了。 |
 |
24
0Z03ry75kWg9m0XS 172 天前
没点进来我还以为你要说组件拆分，命名，写法什么的。
|
|
25
xiaoming1992 172 天前 via Android 1
@rabbbit 如果 js 加载好了、页面水合好了，那就走 js ，发请求，前端更新页面；如果没有，也能保障基础交互（通过 form action 提交）。而这一切都是 react 自动完成的，开发人员只需要按照 action 的形式编码就行
|
|
26
rabbbit 172 天前
看了些资料还是没搞懂，form action 是为了把表单的处理往后端移吗？
不会只是为了解决禁用 js 无法提交的问题吧。 |
|
28
xiaoming1992 172 天前 via Android 1
根据我的理解，react 以及 mui 推崇的各种实践，都是在优化页面首次渲染。
服务端组件是为了减少需要发送到前端的 js ； form action 是为了支持在 js 加载完成前页面也能交互；推荐使用 anchor 而非 js 跳转，同样是为了在 js 加载完成前也能交互（跳转）；多端适配时建议使用 media query ，同样是为了这个目的 |
|
30
rabbbit 172 天前
不确定理解的对不对
form action 在 js 加载完毕后走 fetch 提交表单（跟现在常用的提交表单差不多），在 js 未加载完成时通过 <form action=""> 提交表单。 next.js 会自动帮助用户处理表单 api 地址的问题。 优点是 js 未加载完成前也能进行交互操作。 |
|
31
xuld 172 天前 1
关于提交表单是用 form 的 action 还是 button 的 onclick ，显然是首选 form 的 action 。
表面上，通过 button 的 onclick 触发并提交数据，简单明了。 但这样写会导致只能通过点击按钮来触发提交，其他交互方式则无法提交，比如： 1. 通过在表单内的文本框按回车提交表单 2. 通过”屏幕阅读器“提交表单 3. 在禁用 JS 的浏览器上提交表单 如果你能掌握这些细节，那这个问题的答案显而易见 |
 |
32
isSamle 172 天前
不延期就是最重要的开发规范，其他随便你造
|
 |
33
Forviler 172 天前
不用框架的话 jq 的比较多吧，form 里用 action 这种在现在看来应该是只存在于课本里的知识了吧，入行六七年没用过。不过现在如果真的工作用框架的占多数，Vue/React 。github 上找个星高的项目随便看看。 前几楼说的 理解为什么规范，你就知道该怎么写规范了
|
 |
34
okrfuse 172 天前
前期规范不重要，思路实现方式才重要，后期慢慢就懂得规范了
|
|
35
uni 171 天前
@oamu #29 我个人的观点，管理系统之类的重业务与数据、轻性能的项目，更加应该采取前后端不分离的分工方式，一个业务或者功能就应该由一个人从前到后全部打通，还要前后端分离一个功能分两个人做，增加了多少沟通成本
|
 |
36
n18255447846 171 天前
前期不要考虑什么规范，多学。
你说的就发请求，首先要处理好表单数据，表单里放个 submit 类型按钮，监听 form 的 submit 事件，处理完数据后用 xhr 或 fetch 发请求 |
 |
37
go522000 171 天前
我个人对这些没啥规范。
form 里设置 action 提交会刷新页面（或者跳转到新页面），很少用； button onclick 提交，方便把一些过滤、检测之类的放在一起； jQuery 的 $.post()提交一般与 button onclick 提交放在一起，如果这个项目有用到 jquery 就会直接用这个，方便。 |
 |
38
shiroyuri 171 天前
公司规范 > 社区规范 > 语言规范
|
 |
39
zmqking 171 天前
应该是算老菜鸟吧，还知道 jQuery ，😁
|
 |
40
klo424 171 天前
|
 |
41
HI101 171 天前
请问下个为大佬 如何防止 form 表单重复提交？
|
 |
42
catch 171 天前
直接看 chromium 源码完事
|
 |
43
silence0812 171 天前
我的规矩就是规矩😕
|
 |
44
Torpedo 171 天前
@rookiemaster #1 你说的这种是类似于 best practice ，而不是规范吧。就比如表单这个场景，浏览器原生是有很多 api 的。理论上你用原生的这些 api ，兼容性最好。但是这也要考虑你的产品。假如你的产品都是中后台，那么你可以抛弃原生，自己搞一套。
之所以说是 best practice 就是因为这东西是个实践，实践就要考虑环境，比较依靠经验和技术。 建议学习一些开源的写法。然后搜一下各种 api 的优劣 |
 |
45
pytth 171 天前 via Android
没有什么规范。用什么工具链就用什么做法就行了。
用 jQuery 就用 ajax 异步提交，用原生 javaScript 就用 XHR ，用 Vue 就用 axios 就行了。 现在提交讲究的是前后端分离，不要用 form 的 action 了，这个会有默认跳转事件。 |
 |
46
signalas1 171 天前
按你团队的规范，已经有的功能直接复制粘贴，自己一个人怎么爽怎么来
|
 |
47
hesetiema 169 天前
新时代的 jQuery 替代品：Alpine 。新的流行架构可供参考：AHA——Astro + HTMX + Alpline 。
|
Select Language