验证用户是否修改过页面的数据的实现方法

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

实现要求:
  判断用户是否修改了输入的内容,要能判断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中测试并通过。没有在其它的浏览器中测试。

(0)

相关推荐

  • 验证用户是否修改过页面的数据的实现方法

    起因: 在实现程序的修改模块时,要在页面端检查用户是否修改过数据,以便提醒用户及时保存修改后的数据. 实现要求: 判断用户是否修改了输入的内容,要能判断input中的checkbox,text,radio等,不知道会多少个input,也不知道input的ID和name,要在客户端判断是否修改,不能产生提交.还要同时满足IE和firefox两种环境.也要支持master和content页的使用. 解决方案: 处理思路:在页面加载时记录所有的input的值或状态,如果要求在用户进行修改操作时立即调整

  • 使用jquery DataTable和ajax向页面显示数据列表的方法

    首先在html页面定义好相关长度的行和列,假设table的id=data-table"" 使用jquery DataTable在js中这么写 $(function() { $('#data-table').DataTable( { order : [ [ 1, 'desc' ] ], ajax : { url : "/products", type : 'GET', dataSrc : "" }, columns : [ { data : &qu

  • 在ASP.NET 2.0中操作数据之二十三:基于用户对修改数据进行限制

    导言 很多Web程序都支持用户帐号,根据不同的登录用户提供不同的选项,报表等功能.例如,就我们的教程中,我们要允许供应商公司的一些账户能登录网站并更新它们的产品-包括产品名称和单价,或许还有供应商的信息,比如它们的公司名称,地址,以及联系人信息等等.此外,可能我们还想包含一些帐号留给我们自己公司用户,以便让它们能够登录并进行产品信息修改,比如股价,级别调整等等.我们的Web程序同时也可以允许匿名登录,但是仅仅让这些用户浏览数据.并包含一个系统用户,通过对ASP.NET页面中的数据控件能够进行数据

  • jquery实现用户信息修改验证输入方法汇总

    本文实例讲述了jquery实现用户信息修改验证输入方法.分享给大家供大家参考.具体如下: var realnameFlag = 0; var addressFlag = 0; var zipFlag=0; var cellphoneFlag=0; var homephoneFlag=0; var oldpasswordFlag=1; var newpasswordFlag=1; //判断email function check_email() { $("#showSpan").hide

  • Vue刷新修改页面中数据的方法

    因为Vue对象一旦生成之后,如果只是修改Vue对象中的数据,在页面上是不会自动更新的,得用Vue.set()函数来进行修改,函数格式为Vue.set(data,'para','value'),其中data为Vue创建时传输的data对象名,后面两个参数分别是data对象中的变量名称与值 页面初始化代码: <script type="text/javascript" charset="utf-8"> mui.init(); var data = { dx:

  • Asp.net mvc验证用户登录之Forms实现详解

    这里我们采用asp.net mvc 自带的AuthorizeAttribute过滤器验证用户的身份,也可以使用自定义过滤器,步骤都是一样. 第一步:创建asp.net mvc项目, 在项目的App_Start文件夹下面有一个FilterConfig.cs,在这个文件中可以注册全局的过滤器.我们在文件中添加AuthorizeAttribute过滤器如下: public class FilterConfig { public static void RegisterGlobalFilters(Glo

  • JSP使用JDBC完成动态验证及采用MVC完成数据查询的方法

    本文实例讲述了JSP使用JDBC完成动态验证及采用MVC完成数据查询的方法.分享给大家供大家参考.具体如下: 一.目标: ① 掌握JDBC链接数据库的基本过程: ② 掌握使用JDBC进行数据查询. 二.主要内容: ① 在上一次的实例基础上,通过连接数据库完成用户登录功能,介绍JDBC的基本用法: ② 通过显示所有用户信息进一步介绍JDBC的用法和查询结果的处理. 1.JDBC概念 Java Database Connectivity的缩写,用于连接Java应用程序与各种关系数据库的标准接口.对于

  • asp.net不同页面间数据传递的多种方法

    1. Get(即使用QueryString显式传递)方式:在url后面跟参数.特点:简单.方便.缺点:字符串长度最长为255个字符:数据泄漏在url中.适用数据:简单.少量.关键的数据.适用范围:传递给自己.传递给另一个目标页面:常用于2个页面间传递数据.用法:例如:url后加?UserID=-,跳转到目标页面,目标页面在伺服端可用Request.QueryString["InputText"]获取其指定参数值. 2. Post方式:通用的方式.利用form提交.特点:最常用的方法.常

  • 使用AJAX(包含正则表达式)验证用户登录的步骤

    我们来分一下步骤吧: 1.HTML代码,页面先写出来: 2.正则表达式验证输入的用户名密码是否正确,失去焦点验证 3.Ajax异步提交 4.servlet这是后台处理代码获取数据并对比响应,然后跳转成功页面 效果图: 结构: 代码如下: <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%> <!DOCTYPE HTML PUBLIC "

  • vue-router beforeEach跳转路由验证用户登录状态

    使用vue判断验证用户登录状态 导航钩子类似于生命周期钩子,包含路由进入前,进入后,更新时,退出前等几个周期,主要用于控制导航的前进后退或跳转等. 其中router.beforeEach就是路由进入前的周期,同时有路由的来源和去向两个参数,可以判断和控制当前路由的走向和重定向. 一般router.beforeEach配合vuex全局状态储存使用,验证用户登录状态.也可以结合sessionStorage 和localStorage使用,原理相同. 用户登录状态验证 路由配置 定义需要判断登录状态的

随机推荐