防止在readOnly的input页面产生页面返回

最新推荐文章于 2018-08-29 20:37:44 发布
最新推荐文章于 2018-08-29 20:37:44 发布
阅读量622 收藏
点赞数
分类专栏： .net
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/kkliu201210/article/details/46840423
版权
本文提供了一段JavaScript代码片段，用于在网页中阻止用户通过按下回车键导致页面后退，适用于各种场景，如表单填写等。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

//防止backspace键回退页面
document.onkeydown = function (evt) {
    evt = evt ? evt : window.event;
    //alert(evt.keyCode + " " + evt.srcElement.tagName + " " + evt.srcElement.type + " " + event.srcElement.readOnly);
    //if (evt.keyCode == 8 && event.srcElement.readOnly == true) {
    if (evt.keyCode == 8 && (event.srcElement.readOnly == true || event.srcElement.readOnly == undefined)) {
        //alert("123");
        evt.keyCode = 0;
        return false;
    }
}
input[type='file']在选择好要上传的图片后当前页面实现预览
qq_37410328的博客
05-28 6962
需求在开发中，我们有时候要实现这种效果：在选择要上传的图片后，如果页面只是给出选择文件的名字的话，未免会降低用户体验，就比如，你要更换你账户的头像，本地选择好头像后，而客户端并没有反馈，你无法预览你的头像，那岂不是非常不人性化？所以我们要达到的效果就是，当你在选择好图片后，当前页面马上可以把你选择的图片显示出来如何实现1.准备页面，并给input绑定onchange事件修改书图片： <inp...
解决当文本框为readonly时，按Backspace会刷新页面问题
weixin_33734785的博客
05-27 447
该方法可以兼容多种浏览器，至少具体可以兼容多少种，没有实际考证过。本方法源于别处，具体什么地方，由于时间比较长，忘记了。分享这个方法是因为我自己觉得该方法比较实用，在项目是时候，当时我已经找了几种解决回退键刷新页面问题的方法，但是经实验，都不能够很好的兼容ie11，最终当前方法解决的该问题。 window.onload=function(){ 　　document.getElementsBy...
IE下只读INPUT键入BACKSPACE 后退问题
志超的专栏
07-23 5158
转自：http://blog.163.com/xiao66_fei/blog/static/10990876420124310223648/ 在IE下，如果在readonly的input里面键入backspace键，会触发history.back()， 用以下jquery代码修正之  $("input[readOnly]").keydown(function(e) {            
input设置readonly按键backspace跳到上个链接？
fengyunshaonian的博客
04-01 207
如果input有属性readonly，则backspace键会乱跳，需要写个keydown事件处理，代码如下： [code="java"]$("input[readonly]").keydown(function(e) { if(e.keyCode == 8) { e.preventDefault(); } });[/code]...
js禁用回退键
weixin_30460489的博客
09-02 220
function forbidBackSpace(e) { var ev = e || window.event; //获取event对象 var obj = ev.target || ev.srcElement; //获取事件源 var t = obj.type || obj.getAttribute...
input readonly
魔幻之翼的坚持
09-05 1893
对于文本框,只读状态下和普通状态下,浏览器对其并没有做什么特殊的标记,表面看来,效果是一样的,这样,对用户来说,易用性并不是很高.         当然,我们可以改变只读文本框的背景颜色来加以区分,这个时候就需要程序员自己判断这个文本框是不是只读,然后再引入相应的css,无疑加大了工作量.          这里,使用expression来提供一种解决方案,只需要每个页面引入这个css即可,其
javascript操作文本框readOnly
10-30
4. **CSS样式冲突**：设置`readOnly`后，某些浏览器会自动应用默认的CSS样式（如灰色背景），这可能与页面的其他样式不一致。可以使用CSS覆盖这些默认样式。 5. **安全性和用户体验**：在某些情况下，将输入字段设...
表单元素属性readonly和disabled使用对比
09-28
c) 对于`checkbox`和`radio`，如果想让它们变为只读，虽然没有直接的`readonly`属性，但可以通过绑定点击事件并返回`false`来模拟禁用效果，如在jQuery中使用`bind("click", function() { return false; })`。 总结...
jQuery多个input求和的实现方法
10-24
7. 防止退格键返回页面：由于readonly属性的input无法被删除其值，所以尝试使用退格键删除时，浏览器会默认返回上一页。在文章中提到了另一篇文章《JQuery实现防止退格键返回的方法》，说明如何处理这种情况。 以上...
input 高级限制级用法
09-06
有时候我们需要保存用户在`input`框中输入的内容，即使用户退出页面再次返回也不会丢失之前输入的数据。这可以通过使用`behavior`属性并指向一个特殊的URL来实现。 **示例代码：** ```html <INPUT style="behavior...
php用户登录页面，连接数据库验证用户和密码是否匹配，随机产生验证码；
最新发布
12-17
<input type="text" id="captcha" name="captcha" readonly> 验证码"> <!-- 验证码图片 --> <input type="submit" value="登录"> ``` 2. **服务器端处理**：在`login.php`文件中，首先读取用户输入的数据，然后...
readonly时禁用删除键，readonly按删除键后页面后退解决方案
蕃薯耀
09-16 1201
readonly时禁用删除键， readonly按删除键后页面后退解决方案 &gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt;&gt
ext中屏蔽backsapce删除时退出的代码
正走向大牛的菜鸟
07-31 597
&lt;script type="text/javascript"&gt; //屏蔽只读组件的删除事件。页面中不可编辑元素下按backspace键会使浏览器后退到上一个页面。 //好像只有在IE下会有此问题，FF中没有此问题。 document.onkeydown=function(e){ //IE不传e,使用window.event获得；firefox则从e中获得事件 var...
日常工作问题总结
f的博客
08-29 1388
1. 标点符号不规范，如使用引号统一使用双引号，去掉不必要空格，js句尾使用； 2. 定义变量时注意使用var、let、const； 3. 语句过长时换行； 4. 复杂的ajax请求： $.ajax({ url: '/api/open/comment/getEntityComments', data: JSON.stringify({ ...
解决 TextBox 的 ReadOnly 属性为 true 时，刷新页面后值丢失的方法
weixin_30596735的博客
10-13 220
在 ASP.NET 1.0 中是ReadOnly=True会回传的。 在 ASP.NET 2.0 中是ReadOnly=True就不会回传了。 解决的方法： <asp:textbox id="Username" runat="server" ReadOnly="True"></asp:textbox> 去掉ReadOnly="True"，改成 <asp:tex...
iOS之input file调用相册控制器消失跳转到登陆页
agongcao9295的博客
08-31 636
最近在做一个app要用到H5，其中有一个需求是要点击H5的的控件弹出系统相册，通过在H5的input file 中定义<inputtype="file"class="ios_only"accept="image/*"capture="camera">调用系统相册时虽然可以弹出如下的alertView 但是当点击相册时却相册，反而是跳转到登陆面，查看控...
input标签readonly和disabled的区别
Golden_lion的博客
01-06 793
好像是readonly是可以往后面传递数据的,但是disabled是不可以往后面传递数据的,或者是不能修改value值的
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值