`

网页回退/返回后表单的原数据还显示(动态添加的数据也一样)

阅读更多
<HTML>
    <HEAD>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <META NAME="save" CONTENT="history">
        <STYLE>
            .saveHistory {
                behavior: url(#default#savehistory);
            }
        </STYLE>
        <script>
            function go(){
                location.href = "affirm.html";
            }
//动态向下拉列表添加值            
            function add(){
                var option = null;
                var first = document.getElementById("select");
                option = document.createElement("option");
                option.appendChild(document.createTextNode(document.getElementById("oPersistInput").value));
                option.vaule = document.getElementById("oPersistInput").value;
                option.selected = "selected";
                first.appendChild(option);
            }
        </script>
    </HEAD>
    <BODY>
        <FORM name=a>
            input1:<INPUT class="saveHistory" type="text" id="oPersistInput1">
            <br>
            <br>
            INput2:<INPUT class="saveHistory" type="text" id="oPersistInput">
            <br>
            <INPUT class="saveHistory" type="button" onclick="add()" value="动态添加下拉列表的值">
            <br>
            选择: 
            <select class="saveHistory" id="select" name="select">
                <option value="">-----请选择----</option>
            </select>
            <br>
            <br>
            <input type="button" value="submit" onclick="go()" value="submit">
			<hr>
			&lt;META NAME="save" CONTENT="snapshot"&gt;<br>
        &lt;STYLE&gt;<br>
            .saveSnapshot {<br>
                behavior: url(#default#savesnapshot);<br>
            }<br>
        &lt;/STYLE&gt;<br>
		 这种情况为清空
        </FORM>
    </BODY>
</HTML>

 这是输入的第一个页面,也是表单页面

affirm.html 写道
<HTML>
<HEAD>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
</HEAD>
<BODY>
<FORM>
要返回前面的表单页面,但数据不丢失
<br>
<input type=button value=Back onclick=history.back()>
<br>
<input type=button value=Back onclick=history.go(-1)>
</FORM>
</BODY>
</HTML>

 

分享到:
评论

相关推荐

    禁用backspace网页回退功能的实现代码

    在网页开发中,有时我们需要禁用Backspace键的默认功能,即防止用户按下Backspace时浏览器回退到上一页面。这通常在某些特定场景下是必要的,比如在线编辑器、游戏或者表单填写时,避免用户误操作导致数据丢失。下面...

    vue element动态渲染、移除表单并添加验证的实现

    在示例代码中,我们定义了一个名为vouchersDetail的Vue组件,并在data函数中返回表单数据。组件中还包含了计算属性isShowCloseBtn和方法addItem、deleteItem。isShowCloseBtn用于控制删除按钮的显示,当azList长度...

    网页中上传文件时显示进度条

    首先,我们需要了解AJAX(Asynchronous JavaScript and XML),它是一种创建动态网页的技术,允许在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页内容。在文件上传场景中,AJAX可以帮助我们在后台...

    jQuery实现分步骤注册表单效果(对于长表单的填写非常好用).zip

    7. **回退和跳过功能**:分步骤表单还应提供回退到前一步或跳过某些非必填步骤的功能。jQuery使得这样的功能实现变得简单,只需改变显示的表单部分和更新进度指示即可。 8. **最后提交**:所有步骤完成后,用户会...

    laravel-admin Form表单搜索组件apiSelect(修复版).rar

    4. **错误处理**:考虑添加错误处理机制,当API请求失败时,提供合理的提示或回退策略。 5. **定制化**:`apiSelect`通常允许开发者自定义样式和行为,比如设置加载动画、设置最小输入字符数触发搜索等。 6. **...

    Struts2解决表单重复提交

    为了避免刷新页面导致的重复提交,可以将结果视图的跳转类型设置为redirect,即将页面重定向到另一个视图,这样即使刷新也不会回退到原表单页面。除了直接使用redirect,还可以使用redirectAction,并在result中配置...

    Ajax学习2103.rar

    3. 动态表单:不刷新页面,即可添加、删除或修改表单数据。 4. 实时通讯:聊天室、实时通知等,实现客户端与服务器的双向通信。 5. 地图应用:拖动地图或缩放时,动态加载新的地图区域。 四、Ajax的优缺点 优点...

    ==ajax使用随便聊==

    Ajax,全称Asynchronous JavaScript and XML,是一种用于创建动态网页的网页开发技术,它使得页面无需重新加载即可更新部分数据,极大地提升了用户体验。Ajax的核心是通过JavaScript与XMLHttpRequest对象实现客户端...

    vue大型电商项目尚品汇(后台篇)day02.doc

    为了保持当前页数据,需在删除后判断列表是否为空,决定是否回退到上一页。 5. **三级联动组件**: - 三级联动通常用于实现如商品分类的多级选择,涉及到动态加载数据和事件监听。Vue的`v-for`指令用于遍历数据,`...

    Ajax无刷新分页示例源码

    - **错误处理**:确保Ajax请求失败时有合适的回退机制,如显示错误信息或恢复到初始状态。 - **用户体验**:添加适当的视觉反馈,如加载动画,让用户知道请求正在处理。 - **兼容性测试**:确保在各种浏览器和...

    防止页面重复提交demo

    前端的这种方法虽然有效,但并不能完全解决问题,因为如果用户直接刷新页面或者使用浏览器的回退/前进功能,前端的状态可能无法保持,导致重复提交。 2. **后台session存储随机token**:更为安全的方法是在服务器端...

    Ajax中文手册快速入门

    - **回退和前进按钮问题**:使用Ajax加载的内容不会被添加到浏览器的历史记录中,可能影响回退和前进功能。 总之,Ajax中文手册为初学者提供了一个了解和学习Ajax的平台,涵盖了从基础概念到实际应用的各种知识。...

    PHP提交表单失败后如何保留已经填写的信息

    这样设置后,浏览器会缓存页面内容,当用户尝试回退到表单页面时,他们之前输入的信息会被保留。但是,这种方法有一个潜在的问题,即如果用户的网络连接不稳定或速度较慢,可能导致缓存的内容不是最新的,从而显示...

    vue缓存的keepalive页面刷新数据的方法

    其次,通过路由参数传递数据也是一种常见方法,但在此场景中,由于我们需要在添加完新条目后完全退出编辑页面,而回退操作可能会回到编辑页面,所以这条路也不可行。最后,我们选择了兄弟组件间通信的方式,即通过...

    ajaxajaxajaxajaxajax

    - **回退机制**:对于不支持Ajax的旧版浏览器,可以使用IFrame、隐藏的表单提交等回退方案。 综上所述,Ajax技术通过提升网页的交互性和用户体验,成为了现代Web开发不可或缺的一部分。无论是原始的XMLHttpRequest ...

    最全的Ajax学习资料

    - **网页表单提交**:用户填写表单后,数据即时验证,无需等待页面刷新。 - **实时数据更新**:如股票价格、天气预报等实时信息的展示。 - **页面导航**:实现分页、滚动加载更多内容的效果。 - **地图应用**:拖动...

    仿雅虎首页网站快捷入口和快速登陆代码

    因此,开发者可能需要引入polyfill库来弥补这些差异,或者使用条件注释和特性检测来提供回退方案。 总的来说,这个项目涉及到了JavaScript的基础知识、DOM操作、事件处理、表单验证、Ajax通信等多个方面,同时也...

    Ajax Hacks

    3. **回退机制**:对于不支持Ajax的环境,需要提供非Ajax的备选方案。 综上所述,Ajax是网站开发中的重要技术,通过它,开发者能够构建更加动态和响应式的Web应用。无论是基础的XMLHttpRequest使用,还是高级的库和...

    PHP使用token防止表单重复提交的方法

    2. 生成的 token 应该是一次性的,即每次提交后都需要更新 session 中的 token 值,防止用户回退页面后再次提交。 3. 为了防止 session 持久化带来的问题,可以在处理完表单后清理相关 session 数据。 4. 考虑到用户...

Global site tag (gtag.js) - Google Analytics