编辑表单后离开本页面时做提示(jQuery版)

news/2024/7/10 23:06:58 标签: jQuery, F#, CMS, JavaScript
添加如下JavaScript
[code]
$.fn.enable_changed_form_confirm = function () {
var _f = this;
$('input[@type=text]', this).each(function() {
$(this).attr('_value', $(this).val());
});
$('input[@type=password]', this).each(function() {
$(this).attr('_value', $(this).val());
});
$('textarea', this).each(function() {
$(this).attr('_value', $(this).val());
});
$('input[@type=checkbox]', this).each(function() {
var _v = '';
if(this.checked == true) {
_v = 'on';
} else {
_v = 'off';
}
$(this).attr('_value', _v);
});
$('input[@type=radio]', this).each(function() {
var _v = '';
if(this.checked == true) {
_v = 'on';
} else {
_v = 'off';
}
$(this).attr('_value', _v);
});
$('select', this).each(function() {
$(this).attr('_value', this.options[this.selectedIndex].value);
});

$(this).submit(function() {
window.onbeforeunload = null;
});
window.onbeforeunload = function() {
if(is_form_changed(_f)) {
return "You will lose any unsaved content.";
}
}
}

function is_form_changed(f) {
var changed = false;
$('input[@type=text]', f).each(function() {
var _v = $(this).attr('_value');
if(typeof($(this).attr('_value')) == 'undefined') {
_v = '';
}
if(_v != $(this).val()) {
changed = true;
}
});
$('input[@type=password]', f).each(function() {
var _v = $(this).attr('_value');
if(typeof($(this).attr('_value')) == 'undefined') {
_v = '';
}
if(_v != $(this).val()) {
changed = true;
}
});
$('textarea', f).each(function() {
var _v = $(this).attr('_value');
if(typeof($(this).attr('_value')) == 'undefined') {
_v = '';
}
if(_v != $(this).val()) {
changed = true;
}
});
$('input[@type=checkbox]', f).each(function() {
var _v = '';
if(this.checked == true) {
_v = 'on';
} else {
_v = 'off';
}
if($(this).attr('_value') != _v) {
changed = true;
}
});
$('input[@type=radio]', f).each(function() {
var _v = '';
if(this.checked == true) {
_v = 'on';
} else {
_v = 'off';
}
if($(this).attr('_value') != _v) {
changed = true;
}
});
$('select', f).each(function() {
var _v = $(this).attr('_value');
if(typeof($(this).attr('_value')) == 'undefined') {
_v = '';
}
if(_v != this.options[this.selectedIndex].value) {
changed = true;
}
});
return changed;
}
[/code]
上面的代码将表单的原始值以一个名为"_value"的attr保持在input和select标签上
window.onbeforeunload时判断form是否更改过并给出提示。

需要在具体某个页面里添加如下代码来绑定表单原始值:
[code]
$().ready(function() {
$('form').enable_changed_form_confirm();
});
[/code]

http://www.niftyadmin.cn/n/727729.html

相关文章

领导和下属的思维区别,看看你能成为领导吗?

人与人的差距,到底是怎样形成的?当同类型的两个人原本能力相当,出身也相当,天赋也不过高,机遇也差不多时,有的人为什么可以成为领导,而有的人却只能当员工,其实最大的根本原因就是思维方式的不…

java socket tcp实例_Java实现Socket的TCP传输实例

这篇文章主要介绍了Java实现Socket的TCP传输,实例分析了java通过socket实现TCP传输的相关技巧,需要的朋友可以参考下本文实例讲述了Java实现Socket的TCP传输。分享给大家供大家参考。具体分析如下:客户端发数据到服务端* Tcp传输,客户端建立的过程。* 1&…

GridView中对表头设定背景图片

后台实现方法: Codeprotected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e){ if (e.Row.RowType DataControlRowType.Header) { e.Row.Attributes.Add("style", "background-image:url(background.gif)"); }}前台…

java6.5官方下载_Java修炼手册

Java修炼手册app是一款主要提升java水平的学习软件,软件中包含了基础学习、学习进阶、面试宝典、开发者导航等等,软件内还包含了很多编译器,如java编译器、c编译器、js编译器、html编译器等等,同时各种语言的热度也会呈现出来&…

教你十个方法提高员工忠诚度

近几年来,越来越多的企业感觉到现在“人难招、人难管、人难留”。员工工作不努力、忠诚度不高是他们普遍的共识。   员工出现工作不努力、混日子的情况在很大程度上原因不在员工身上,管理者要多在自己身上、在公司的流程制度上找原因,究竟有…

sap打印机配置

打印机配置的T-code: spad 这个不多说了,主要谈一下打印机安装的访问模式,如图: 打印机访问模式常用的主要有以下几种,L,S,U,F L的意思很容易理解,就是local本地的意思,就是本机安装的打印机。S主要是windows系统下的…

Rails宝典八十式:Rails 2.0简化视图

Rails 2.0 里视图应该怎样写&#xff1f;views/products/index.html.erb: [code] <% render :partial > products %> [/code]views/products/show.html.erb: [code] <% render :partial > product %> [/code]_product.html.erb: [code] <% div_for produc…

layui中全选反选_layui结合form,table的全选、反选v1.0示例讲解

Box" name"" lay-skin"primary" lay-filter"itemChoose">3、js代码如下&#xff1a;Box(allChoose),function(data){var child $(data.elem).parents(table).find(tbody input[type"checkBox"]);child.each(function(index,i…