OfflineSave离线保存代码再次发布使用说明

2024-08-19 15:48:43

必知：所有需要处理的HTML元素必须具有ID属性，组件只会探测元素的ID属性

1. 在</Head>上加入
<STYLE>
.userData {behavior:url(#default#userdata);}
</STYLE>

2. 在<body>下加入
<INPUT type=text class=userData id=OfflineSave_Area style="display:none">

3. 在</body>上加入
<script src=OfflineSave.js></script>

4. 为form标签加入扩展属性OfflineSave
例：<form id=myOfflineSaveForm OfflineSave ToolsBarStyle="mycssclass">
ToolsBarStyle为css class属性，容器为div,包含select,input,button

注意：
情况1：
<form id=myform onsubmit="docheck(this)">
<input type=text id=mytext>
<input type=submit value=submit>
</form>
在这种情况下,组件可以自动探测服务器存活状态，如服务器无法连接时，会提示本地保存,
并且docheck函数也可以正常工作

情况2：
<form id=myform >
<input type=text id=mytext>
<input type=button value=submit onclick="myform.submit()">
</form>
在这种情况下,组件无法截获提交事件，也无法自动探测服务器存活状态

建议：检测表单内数据时，在form标签onsubmit事件内写入检测函数

联系我：qq:13872888 注明：blueidea

代码如下:

var os_Obj,os_usd;

var os_dg=document.getElementById;
var os_ButtonCss="style=\"cursor:hand;height:20px;padding:0px 3px;border:1px solid #67C1E4;\"";
var os_SelectCss="style=\"font-size:12px;\"";
var os_SaveSuccessStr="离线数据保存成功!";
var os_SaveProStr="请输入离线保存的名称:(如为空则用当前时间表示)";
var os_LoadProStr="确认要载入离线数据吗?";
var os_DelProStr="确认要删除离线数据吗?";
var os_DelSuccessStr="离线数据删除成功!";
var os_oUD="OfflineSave_oPersistInput";
var os_DefaultFiledLength=10;//Default Filed length
var os_str="OfflineSave_";
var os_CannotSaveStr="保存数据时出现错误![离线保存空间仅限640K]\n\n有可能已超出离线保存容量!请删除部分数据后再保存!";
var os_expires = (new Date(2010,1,1)).toUTCString();

InitOfflineSave();
function InitOfflineSave(){
    for(var i=0;i<document.forms.length;i++){
        if(document.forms[i].OfflineSave!=null){
            os_usd=os_dg("OfflineSave_Area");
            var tbs=document.forms[i].ToolsBarStyle==null?"":document.forms[i].ToolsBarStyle;
            os_CreateToolBar(document.forms[i],tbs);
            os_GetOfflineSaveList(document.forms[i].id);
            var cmd=document.forms[i].onsubmit==null?"":document.forms[i].onsubmit;
            if(cmd!=""){
                cmd=document.forms[i].onsubmit+"";
                cmd=cmd.split("{")[1].split("}")[0].replace("\n","");
            }
            cmd=escape(cmd);
            eval("document.forms[i].onsubmit=function(){return os_CheckSubmit('"+document.forms[i].id+"','"+cmd+"');}");
            break;
        }
    }
}

function os_CreateToolBar(obj,boolbarstyle){
    var hc;
    hc="<div id='os_"+obj.id+"_div'><select id='os_"+obj.id+"_Select' "+os_SelectCss+">";
    hc+="</select>";
    hc+=" ";
    hc+="<input type=button "+os_ButtonCss+" value=载入 onclick=\"os_LoadData('"+obj.id+"');\">";
    hc+=" ";
    hc+="<input type=button "+os_ButtonCss+" value=删除 onclick=\"os_DelData('"+obj.id+"');\">";
    hc+="  ";
    hc+="<input type=button "+os_ButtonCss+" value=离线保存 onclick=\"os_SaveData('"+obj.id+"');\"></div>";
    obj.innerHTML=hc+obj.innerHTML;
    if(boolbarstyle==""){
        os_dg("os_"+obj.id+"_div").style.textAlign     = "left";
        os_dg("os_"+obj.id+"_div").style.textvAlign     = "middle";
        os_dg("os_"+obj.id+"_div").style.paddingTop     = "3";
        os_dg("os_"+obj.id+"_div").style.height     = "30";
        os_dg("os_"+obj.id+"_div").style.border     = "1 solid black";
        os_dg("os_"+obj.id+"_div").style.paddingLeft     = "5";
    }
    else
        os_dg("os_"+obj.id+"_div").className=boolbarstyle;
}

function os_LoadData(id){
var v=os_dg("os_"+id+"_Select").selectedIndex;
if(v==0) return;

function os_DelData(id){
var v=os_dg("os_"+id+"_Select").selectedIndex;
if(v==0) return;

var ud=os_str+id+os_dg(id).length;
    if(confirm(os_DelProStr+"\n\n记录名称:"+os_getUserData(ud,"f_"+v+"_os_savename")+"\n保存时间:"+os_getUserData(ud,"f_"+v+"_os_savedate"))){
        var i=0;
        var ud=os_str+id+os_dg(id).length;
        var lcount=parseInt(os_getUserData(ud,"count"));

var vcount=os_dg(id).length;
        for(i=0;i<vcount;i++){
            if(os_dg(id).item(i).type!="button"&&os_dg(id).item(i).id!="os_"+id+"_Select")
                if(v<lcount)
                    os_putUserData(ud,"f_"+v+"_"+os_dg(id).item(i).id,os_getUserData(ud,"f_"+lcount+"_"+os_dg(id).item(i).id));
                os_remUserData(ud,"f_"+lcount+"_"+os_dg(id).item(i).id);
        }
        if(v<lcount){
            os_putUserData(ud,"f_"+v+"_os_savename",os_getUserData(ud,"f_"+lcount+"_os_savename"));
            os_putUserData(ud,"f_"+v+"_os_savedate",os_getUserData(ud,"f_"+lcount+"_os_savedate"));
        }
        os_remUserData(ud,"f_"+lcount+"_os_savename");
        os_remUserData(ud,"f_"+lcount+"_os_savedate");

eval("os_putUserData(ud,\"count\",\""+(lcount-1)+"\");");

function os_SaveData(id){
    if(os_dg(id).length<=0){
        alert("[OfflineSave]Error:\n\n"+id+" no Element!(input,radio,checkbox,select)");
        return;
    }

var sd=new Date();
    var sn=prompt(os_SaveProStr,sd.toLocaleString()+":MyData");
    var ud=os_str+id+os_dg(id).length;
    var lcount=os_getUserData(ud,"count");
    lcount=lcount==""||lcount==null?1:parseInt(lcount)+1;
    if(os_dg(id).length*10*2*lcount>64000){
        alert(os_CannotSaveStr);
        return;
    }
    try{

sn=sn==""?sd.toLocaleString():sn;

function os_putUserData(sUDName,sName,sVal) {
  os_usd.load(sUDName);
  os_usd.expires = os_expires;
  os_usd.setAttribute(sName,sVal);
  os_usd.save(sUDName);
  return;
}

function os_remUserData(sUDName,sName) {
  os_usd.load(sUDName);
  os_usd.removeAttribute(sName);
  os_usd.save(sUDName);
  return;
}

function os_getUserData(sUDName,sName) {
os_usd.load(sUDName);
return os_usd.getAttribute(sName);
}

function os_delUserData(sUDName){
  var oTimeNow = new Date(); // Start Time
  oTimeNow.setMinutes(oTimeNow.getMinutes()+1);
  var sExpirationDate = oTimeNow.toUTCString();
  os_usd.load(sUDName);
  os_usd.expires = sExpirationDate;
  os_usd.save(sUDName);
  return;
}

function os_CanSubmit(url){
    var xmlHTTP = window.ActiveXObject? new ActiveXObject("Microsoft.XMLHTTP"):new XMLHttpRequest();
    xmlHTTP.open("get",url,false);
    xmlHTTP.send("");
    return xmlHTTP.status=="200";
}

OfflineSave.htm

代码如下:

<html>
    <head>
        <title>离线保存</title>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        <STYLE> .userData {behavior:url(#default#userdata);}
    </STYLE>
        <link href="css.css" rel="stylesheet" type="text/css">
    </head>
    <body>
        <INPUT type="text" class="userData" id="OfflineSave_Area" style="DISPLAY:none">
        <table width="100%" border="0" cellpadding="0" cellspacing="0" style="FONT-SIZE:12px">
            <tr>
                <td height="78" colspan="3" valign="top"><font size="4" color="red">Ajax演示程序(J2EE)</font>
                    <BR>
                    <BR>
                    服务端:<b>JDK1.4 TomCAT4.1 Hibernate3 MSSQL Server2000(SP4) DWR1.0</b><BR>
                    客户端:<b>JavaScript(CallBack) VML </b>
                    <BR>
                    编写人:富深协通常州研发中心姜泉</td>
            </tr>
            <tr>
                <td colspan="3"><BR>
                    <table border="1" class="listView" width="100%">
                        <Caption>
                            离线数据保存(仅限ＩＥ浏览器5.0版本以上)</Caption>
                        <tbody>
                            <tr>
                                <td><form id="myOfflineSaveForm" action="J2EE_AJAX.html" onsubmit="alert('这是在HTML页面中的onsubmit事件中执行的函数!');" OfflineSave>
                                        <table cellSpacing="0" cellPadding="2" width="100%" border="1">
                                            <TR>
                                                <TD>名称<input type="text" id="name" size="5">
                                                </TD>
                                                <TD>公司全称<TEXTAREA id="gsqc" name="gsqc" rows="2" cols="20">
                                                    </TEXTAREA></TD>
                                                <TD>客户代码<INPUT id="dm" type="checkbox" name="dm"></TD>
                                            </TR>
                                            <tr>
                                                <TD>分类<SELECT id="fl" name="fl">
                                                        <OPTION selected>中国人</OPTION>
                                                        <OPTION>外星人</OPTION>
                                                        <OPTION>山西人</OPTION>
                                                    </SELECT></TD>
                                                <TD>性别<INPUT id="cz" type="radio" value="cz" checked name="RadioGroup">男<INPUT id="cz1" type="radio" value="cz1" name="RadioGroup">女</TD>
                                                <TD>增加日期<SELECT id="rq" size="4" name="rq" multiple>
                                                        <OPTION>2000年</OPTION>
                                                        <OPTION>2003年</OPTION>
                                                        <OPTION>2004年</OPTION>
                                                        <OPTION>2005年</OPTION>
                                                    </SELECT></TD>
                                            </tr>
                                        </table><input type=submit value=submit >
                                    </form>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                </td>
            </tr>
        </table>

OfflineSave离线保存代码再次发布使用说明

必知:所有需要处理的HTML元素必须具有ID属性,组件只会探测元素的ID属性 1. 在</Head>上加入 <STYLE> .userData {behavior:url(#default#userdata);} </STYLE> 2. 在<body>下加入 <INPUT type=text class=userData id=OfflineSave_Area style="display:none"> 3. 在<
Android Studio屏幕方向以及UI界面状态的保存代码详解

项目:Orientation package com.example.orientation; import android.os.Bundle; import android.util.Log; import android.view.View; import android.widget.Button; import android.widget.TextView; import androidx.appcompat.app.AppCompatActivity; public class M
asp下实现代码的“运行代码”“复制代码”“保存代码”功能源码

Function content_Code(Str) dim ary_String,i,n,n_pos ary_String=split(Str,"[ code ]") n=ubound(ary_String) If n<1 then content_Code=Str Exit function End If for i=1 to n n_pos=inStr(ary_String(i),"[/ code ]") If n_pos>0 then ary_S
Python稀疏矩阵及参数保存代码实现

1. 稀疏矩阵的建立:coo_matrix() from scipy.sparse import coo_matrix # 建立稀疏矩阵 data = [1,2,3,4] row = [3,6,8,2] col = [0,7,4,9] c = coo_matrix((data,(row,col)),shape=(10,10)) #构建10*10的稀疏矩阵,其中不为0的值和位置在第一个参数 print(c) 2. 稀疏矩阵转化为密集矩阵:todense() d = c.todense() prin
如何重写Laravel异常处理类详解

现在开发前后端分离变得越来越流行了,后端只提供接口返回json格式的数据,即使是错误信息也要以json格式来返回,然而目前无论是Laravel框架还是ThinkPHP框架,都只提供了返回json数据的方法,对异常的处理并不是以json格式来返回给我们,所以这里就需要我们自己来改写. 首先我们在app/Exceptions目录新建一个ExceptionHandler.php继承自Handler.php namespace App\Exceptions; class ExceptionHandler
ajax+jsp草稿自动保存的实现代码

一.表单部分 (index.html) 首先是表单填写页面,用一个ID为AutoSaveMsg的DIV来显示返回信息,并且用一个ID为Draft_AutoSave的CheckBox来确定是否进行自动保存,然后将Textarea的ID命名为message.同时为了应对多用户同时使用的需要,加上用户名,每个用户的草稿分开保存.为了说明方便,这里把一些修饰性的东西去掉,这样看起来比较明了 <h2>AJAX应用之草稿自动保存</h2><br /> <!-- 用户名默认为N
使用Typescript和ES模块发布Node模块的方法

本文主要介绍了使用Typescript和ES模块发布Node模块的方法,分享给大家,具体如下: TypeScript已经成为一种非常流行的JavaScript语言,这是有原因的.它的类型系统和编译器能够在您的软件运行之前的编译时捕获各种bug,并且附加的代码编辑器功能使它成为一个非常适合开发人员的高效环境. 但是,当你想用TypeScript编写一个库或包,同时又想用JavaScript来发布,这样你的最终用户就不必手动编译你的代码,会发生什么?我们如何使用现代的JavaScript功能(如ES
PHPWIND 5.3 运行代码功能实现代码

照样子弄了一下,发现数据格式已经换了,想着弄弄看,随便弄了下,感觉还有搞头.不过里面有<br />,PHP的字符替换我也不懂,试了下preg_replace发现只能替换一个,搞笑了.上网猛查资料,发现大多人说要用函数,汗汗.然后发现还有str_replace,试了下,总算可以了. 具体方法如下: 在template/你的模板名/read.html 在合适的地方加入: 复制代码代码如下: <script> function run_Code(code) { var pop=wind
Android 实现WebView点击图片查看大图列表及图片保存功能

在日常开发过程中,有时候会遇到需要在app中嵌入网页,此时使用WebView实现效果,但在默认情况下是无法点击图片查看大图的,更无法保存图片.本文将就这一系列问题的实现进行说明. 图示: 项目的知识点: 加载网页后如何捕捉网页中的图片点击事件: 获取点击的图片资源后进行图片显示,获取整个页面所有的图片: 支持查看上下一张的图片以及对图片缩放显示: 对图片进行保存: 其他:图片缓存的处理(不用每次都重新加载已查看过的图片) 项目代码结构: 前期准备(添加权限.依赖和混淆设置): 添加权限: <us
Scrapy抓取京东商品、豆瓣电影及代码分享

1.scrapy基本了解 Scrapy是一个为了爬取网站数据,提取结构性数据而编写的应用框架.可以应用在包括数据挖掘, 信息处理或存储历史数据等一系列的程序中.其最初是为了页面抓取(更确切来说,网络抓取)所设计的,也可以应用在获取API所返回的数据(比如Web Services)或者通用的网络爬虫. Scrapy也能帮你实现高阶的爬虫框架,比如爬取时的网站认证.内容的分析处理.重复抓取.分布式爬取等等很复杂的事. Scrapy主要包括了以下组件: 引擎(Scrapy): 用来处理整个系统的数据流

OfflineSave离线保存代码再次发布使用说明

相关推荐

随机推荐