jquery - 当调用浏览器后退按钮时,$(document).ready() 在 v2 和 v3 中的行为是否不同?
问题描述
我有一个典型<FORM>
的页面,加载页面时其字段为空。
如果用户在提交表单后点击浏览器返回按钮,页面将显示用户填写的字段。但是,任何在回调中读取这些字段的尝试$document.ready()
都会返回空值。这适用于 jQuery v2。
使用 v3,它似乎可以正常工作。
在我为现有的生产网站测试和迁移到 v3 的工作预算之前,我想确认这是否是一个已知的差异。
jQuery v2:
window.addEventListener("load", ()=> {
console.log("! textbox:", document.getElementById("textbox").value);
});
$(document).ready(() => {
console.log("$ textbox:", document.getElementById("textbox").value);
});
<p>1. Enter something in the textbox and click Submit. 2. Click the browser back button. 3. Check console log.</p>
<form method="post">
<input id='textbox' required />
<br/>
<input type="submit" />
</form>
<script src='https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js'></script>
jQuery v3:
window.addEventListener("load", ()=> {
console.log("! textbox:", document.getElementById("textbox").value);
});
$(document).ready(() => {
console.log("$ textbox:", document.getElementById("textbox").value);
});
<p>1. Enter something in the textbox and click Submit. 2. Click the browser back button. 3. Check console log.</p>
<form method="post">
<input id='textbox' required />
<br/>
<input type="submit" />
</form>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
解决方案
推荐阅读
- google-people-api - People.Connections.List nextSyncToken 一周后过期
- devops - 与 helm "*-delete" 钩子混淆。升级或安装命令时不删除以前的资源
- ibm-cloud - IBM Watson Assistant:还记得之前的意图吗?
- typescript - 在 monorepo 中使用 jest + typescript
- ruby - 有谁知道如何通过 Redmine Api Rest 创建一个版本?
- python - 如何从 .txt 文件创建表?
- node.js - 部署到 Netlify 后,我的 bundle.js 文件要小得多。这是什么法术?
- react-native - 如何在滚动反应原生时将视图组件停靠到屏幕顶部?
- sql - 在 PL/pgSQL 对象中按名称访问对象字段
- ios - 为什么 Xcode 中我的个人设备名称旁边有数字?