手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >验证用户是否修改过页面的数据的实现方法
验证用户是否修改过页面的数据的实现方法
摘要:起因:在实现程序的修改模块时,要在页面端检查用户是否修改过数据,以便提醒用户及时保存修改后的数据。实现要求:判断用户是否修改了输入的内容,要...

起因:

在实现程序的修改模块时,要在页面端检查用户是否修改过数据,以便提醒用户及时保存修改后的数据。

实现要求:

判断用户是否修改了输入的内容,要能判断input中的checkbox,text,radio等,不知道会多少个input,也不知道input的ID和name,要在客户端判断是否修改,不能产生提交。还要同时满足IE和firefox两种环境。也要支持master和content页的使用。

解决方案;

处理思路:在页面加载时记录所有的input的值或状态,如果要求在用户进行修改操作时立即调整控件状态,则在数据区div上的onclick和onkeypress事件里调用检查数据是否改变的函数,并设置相应控件的状态(用ha_setch())。如果是在提交或用户手动控制检查过程时,则在相应的操作事件中调用检查数据是否改变(例在button的onclick()中使用ha_checkin()控制提交)。

以下是实现代码

var ha_last=new Array;//定义一个全局的空对象,存放所有的初始值。

function ha_get()//读取初始值

{ var ha_input = document.getElementsByTagName("input");

for (var i=0;i<ha_input.length;i++)

{

if (ha_input[i].type=="password"){ ha_last.push(ha_input[i].value);}//根本页面需要设置type的值和对象属性

if (ha_input[i].type=="radio") {ha_last.push(ha_input[i].checked);}//要保证检查的范围是否准确

}

}

window.onload=ha_get;//绑定读取初始值的函数

function ha_checkin()//检查新的输入值和初始值是否相等。返回判断结果。true为没有发生修改,false为有修改。

{ var ha_now=new Array;

var ha_input = document.getElementsByTagName("input");

for (var i=0;i<ha_input.length;i++)

{

if (ha_input[i].type=="password"){ ha_now.push(ha_input[i].value);}//根本页面需要设置type的值和对象属性。

if (ha_input[i].type=="radio") {ha_now.push(ha_input[i].checked);}//也要保证和ha_get()中检查的标签相一致

}

if (ha_now.toString()==ha_last.toString())//没修改

{return true;}

else//有修改

{return false;}

}

function ha_setch(){//设置相应的控件状态

if (ha_checkin())//没有变化

//改变控件的显示和功能状态

else//有变化

//改变控件的显示和功能状态

}

注:以上解决方案只在IE6和firefox3.0。2中测试并通过。没有在其它的浏览器中测试。

【验证用户是否修改过页面的数据的实现方法】相关文章:

js+html5操作sqlite数据库的方法

JS显示日历和天气的方法

Jquery注册事件实现方法

JavaScript检查数字是否为整数或浮点数的方法

js获取页面description的方法

禁止按回车键提交表单的方法

Javascript实现广告页面的定时关闭

jQuery实现自动滚动到页面顶端的方法

js去字符串前后空格的实现方法

js比较日期大小的方法

精品推荐
分类导航