时间:2021-05-26
必知:所有需要处理的HTML元素必须具有ID属性,组件只会探测元素的ID属性
1.在</Head>上加入
<STYLE>
.userData{behavior:url(#default#userdata);}
</STYLE>
2.在<body>下加入
<INPUTtype=textclass=userDataid=OfflineSave_Areastyle="display:none">
3.在</body>上加入
<scriptsrc=OfflineSave.js></script>
4.为form标签加入扩展属性OfflineSave
例:<formid=myOfflineSaveFormOfflineSaveToolsBarStyle="mycssclass">
ToolsBarStyle为cssclass属性,容器为div,包含select,input,button
注意:
情况1:
<formid=myformonsubmit="docheck(this)">
<inputtype=textid=mytext>
<inputtype=submitvalue=submit>
</form>
在这种情况下,组件可以自动探测服务器存活状态,如服务器无法连接时,会提示本地保存,
并且docheck函数也可以正常工作
情况2:
<formid=myform>
<inputtype=textid=mytext>
<inputtype=buttonvalue=submitonclick="myform.submit()">
</form>
在这种情况下,组件无法截获提交事件,也无法自动探测服务器存活状态
建议:检测表单内数据时,在form标签onsubmit事件内写入检测函数
联系我:qq:13872888注明:blueidea
复制代码 代码如下:
varos_Obj,os_usd;
varos_dg=document.getElementById;
varos_ButtonCss="style=\"cursor:hand;height:20px;padding:0px3px;border:1pxsolid#67C1E4;\"";
varos_SelectCss="style=\"font-size:12px;\"";
varos_SaveSuccessStr="离线数据保存成功!";
varos_SaveProStr="请输入离线保存的名称:(如为空则用当前时间表示)";
varos_LoadProStr="确认要载入离线数据吗?";
varos_DelProStr="确认要删除离线数据吗?";
varos_DelSuccessStr="离线数据删除成功!";
varos_oUD="OfflineSave_oPersistInput";
varos_DefaultFiledLength=10;//DefaultFiledlength
varos_str="OfflineSave_";
varos_CannotSaveStr="保存数据时出现错误![离线保存空间仅限640K]\n\n有可能已超出离线保存容量!请删除部分数据后再保存!";
varos_expires=(newDate(2010,1,1)).toUTCString();
InitOfflineSave();
functionInitOfflineSave(){
for(vari=0;i<document.forms.length;i++){
if(document.forms[i].OfflineSave!=null){
os_usd=os_dg("OfflineSave_Area");
vartbs=document.forms[i].ToolsBarStyle==null?"":document.forms[i].ToolsBarStyle;
os_CreateToolBar(document.forms[i],tbs);
os_GetOfflineSaveList(document.forms[i].id);
varcmd=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(){returnos_CheckSubmit('"+document.forms[i].id+"','"+cmd+"');}");
break;
}
}
}
functionos_CreateToolBar(obj,boolbarstyle){
varhc;
hc="<divid='os_"+obj.id+"_div'><selectid='os_"+obj.id+"_Select'"+os_SelectCss+">";
hc+="</select>";
hc+=" ";
hc+="<inputtype=button"+os_ButtonCss+"value=载入onclick=\"os_LoadData('"+obj.id+"');\">";
hc+=" ";
hc+="<inputtype=button"+os_ButtonCss+"value=删除onclick=\"os_DelData('"+obj.id+"');\">";
hc+=" ";
hc+="<inputtype=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="1solidblack";
os_dg("os_"+obj.id+"_div").style.paddingLeft="5";
}
else
os_dg("os_"+obj.id+"_div").className=boolbarstyle;
}
functionos_CheckSubmit(id,subfunc){
if(!os_CanSubmit(os_dg(id).action)){
if(confirm("离线保存提示:\n\n您要提交的服务器连接可能出现问题,是否进行离线保存?")){
os_SaveData(id);
}
returnfalse;
}
eval(unescape(subfunc));
}
functionos_LoadData(id){
varv=os_dg("os_"+id+"_Select").selectedIndex;
if(v==0)return;
varud=os_str+id+os_dg(id).length;
if(confirm(os_LoadProStr+"\n\n记录名称:"+os_getUserData(ud,"f_"+v+"_os_savename")+"\n保存时间:"+os_getUserData(ud,"f_"+v+"_os_savedate"))){
varlcount=os_dg(id).length;
for(vari=0;i<lcount;i++){
if(os_dg(id).item(i).type!="submit"&&os_dg(id).item(i).type!="reset"&&os_dg(id).item(i).type!="button"&&os_dg(id).item(i).id!="os_"+id+"_Select"){
if(os_dg(id).item(i).type=="radio"||os_dg(id).item(i).type=="checkbox")
os_dg(os_dg(id).item(i).id).checked=os_getUserData(ud,"f_"+v+"_"+os_dg(id).item(i).id)=="1"?true:false;
else{
if(os_dg(id).item(i).type=="select-multiple"){
varsm=os_getUserData(ud,"f_"+v+"_"+os_dg(id).item(i).id).split(",");
varx;
for(x=0;x<os_dg(id).item(i).length;x++)
os_dg(id).item(i).options[x].selected=false;
for(x=0;x<sm.length-1;x++)
os_dg(id).item(i).options[parseInt(sm[x])].selected=true;
}
else{
if(os_dg(id).item(i).type=="select-one")
os_dg(os_dg(id).item(i).id).selectedIndex=parseInt(os_getUserData(ud,"f_"+v+"_"+os_dg(id).item(i).id));
else{
//alert(os_getUserData(ud,"f_"+v+"_"+os_dg(id).item(i).id));
os_dg(os_dg(id).item(i).id).value=unescape(os_getUserData(ud,"f_"+v+"_"+os_dg(id).item(i).id));
}
}
}
}
}
}
}
functionos_DelData(id){
varv=os_dg("os_"+id+"_Select").selectedIndex;
if(v==0)return;
varud=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"))){
vari=0;
varud=os_str+id+os_dg(id).length;
varlcount=parseInt(os_getUserData(ud,"count"));
varvcount=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)+"\");");
vars=os_dg("os_"+id+"_Select");
if(lcount==1){
os_delUserData(ud);
while(s.length>0)s.remove(0);
s.add(newOption("无数据",0));
}
else{
s.item(0).text="共有"+(lcount-1)+"个记录";
if(v<s.length){
s.item(0).value=0;
s.item(v).text=s.item(s.length-1).text;
}
s.remove(s.length-1);
}
alert(os_DelSuccessStr);
}
}
functionos_SaveData(id){
if(os_dg(id).length<=0){
alert("[OfflineSave]Error:\n\n"+id+"noElement!(input,radio,checkbox,select)");
return;
}
varsd=newDate();
varsn=prompt(os_SaveProStr,sd.toLocaleString()+":MyData");
varud=os_str+id+os_dg(id).length;
varlcount=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;
varvcount=os_dg(id).length;
for(vari=0;i<vcount;i++){
if(os_dg(id).item(i).type!="submit"&&os_dg(id).item(i).type!="reset"&&os_dg(id).item(i).type!="button"&&os_dg(id).item(i).id!="os_"+id+"_Select"){
if(os_dg(id).item(i).type=="radio"||os_dg(id).item(i).type=="checkbox"){
eval("os_putUserData(\""+ud+"\",\"f_"+lcount+"_"+os_dg(id).item(i).id+"\",\""+(os_dg(id).item(i).checked?"1":"0")+"\");");
}
else{
if(os_dg(id).item(i).type=="select-multiple"){
varmc="";
for(varx=0;x<os_dg(id).item(i).length;x++){
if(os_dg(id).item(i).options[x].selected)mc+=x+",";
}
eval("os_putUserData(\""+ud+"\",\"f_"+lcount+"_"+os_dg(id).item(i).id+"\",\""+mc+"\");");
}
else{
if(os_dg(id).item(i).type=="select-one")
eval("os_putUserData(\""+ud+"\",\"f_"+lcount+"_"+os_dg(id).item(i).id+"\",\""+os_dg(id).item(i).selectedIndex+"\");");
else
eval("os_putUserData(\""+ud+"\",\"f_"+lcount+"_"+os_dg(id).item(i).id+"\",\""+escape(os_dg(id).item(i).value)+"\");");
}
}
}
}
eval("os_putUserData(\""+ud+"\",\"f_"+lcount+"_os_savename\",\""+sn+"\");");
eval("os_putUserData(\""+ud+"\",\"f_"+lcount+"_os_savedate\",\""+sd.toLocaleString()+"\");");
eval("os_putUserData(ud,\"count\",\""+lcount+"\");");//savelistcount
vars=os_dg("os_"+id+"_Select");
s.item(0).text="共有"+lcount+"个记录";
s.item(0).value=0;
s.add(newOption(sn,lcount));
alert(os_SaveSuccessStr);
}
catch(e){
alert(os_CannotSaveStr+"\n\n错误原因:"+e);
}
}
functionos_GetOfflineSaveList(id){
varud=os_str+id+os_dg(id).length;
vars=os_dg("os_"+id+"_Select");
varlcount=os_getUserData(ud,"count");
varsv="";
while(s.length>0)s.remove(0);
lcount=lcount==""||lcount==null?0:parseInt(lcount);
if(lcount<=0)
s.add(newOption("无数据","0"));
else{
s.add(newOption("共有"+lcount+"个记录","0"));
for(vari=1;i<=lcount;i++){
eval("sv=os_getUserData(ud,\"f_"+i+"_os_savename\");");
s.add(newOption(sv,i));
}
}
}
functionos_putUserData(sUDName,sName,sVal){
os_usd.load(sUDName);
os_usd.expires=os_expires;
os_usd.setAttribute(sName,sVal);
os_usd.save(sUDName);
return;
}
functionos_remUserData(sUDName,sName){
os_usd.load(sUDName);
os_usd.removeAttribute(sName);
os_usd.save(sUDName);
return;
}
functionos_getUserData(sUDName,sName){
os_usd.load(sUDName);
returnos_usd.getAttribute(sName);
}
functionos_delUserData(sUDName){
varoTimeNow=newDate();//StartTime
oTimeNow.setMinutes(oTimeNow.getMinutes()+1);
varsExpirationDate=oTimeNow.toUTCString();
os_usd.load(sUDName);
os_usd.expires=sExpirationDate;
os_usd.save(sUDName);
return;
}
functionos_CanSubmit(url){
varxmlHTTP=window.ActiveXObject?newActiveXObject("Microsoft.XMLHTTP"):newXMLHttpRequest();
xmlHTTP.open("get",url,false);
xmlHTTP.send("");
returnxmlHTTP.status=="200";
}
OfflineSave.htm
复制代码 代码如下:
<html>
<head>
<title>离线保存</title>
<metahttp-equiv="Content-Type"content="text/html;charset=gb2312">
<STYLE>.userData{behavior:url(#default#userdata);}
</STYLE>
<linkhref="css.css"rel="stylesheet"type="text/css">
</head>
<body>
<INPUTtype="text"class="userData"id="OfflineSave_Area"style="DISPLAY:none">
<tablewidth="100%"border="0"cellpadding="0"cellspacing="0"style="FONT-SIZE:12px">
<tr>
<tdheight="78"colspan="3"valign="top"><fontsize="4"color="red">Ajax演示程序(J2EE)</font>
<BR>
<BR>
服务端:<b>JDK1.4TomCAT4.1Hibernate3MSSQLServer2000(SP4)DWR1.0</b><BR>
客户端:<b>JavaScript(CallBack)VML</b>
<BR>
编写人:富深协通常州研发中心姜泉</td>
</tr>
<tr>
<tdcolspan="3"><BR>
<tableborder="1"class="listView"width="100%">
<Caption>
离线数据保存(仅限IE浏览器5.0版本以上)</Caption>
<tbody>
<tr>
<td><formid="myOfflineSaveForm"action="J2EE_AJAX.html"onsubmit="alert('这是在HTML页面中的onsubmit事件中执行的函数!');"OfflineSave>
<tablecellSpacing="0"cellPadding="2"width="100%"border="1">
<TR>
<TD>名称<inputtype="text"id="name"size="5">
</TD>
<TD>公司全称<TEXTAREAid="gsqc"name="gsqc"rows="2"cols="20">
</TEXTAREA></TD>
<TD>客户代码<INPUTid="dm"type="checkbox"name="dm"></TD>
</TR>
<tr>
<TD>分类<SELECTid="fl"name="fl">
<OPTIONselected>中国人</OPTION>
<OPTION>外星人</OPTION>
<OPTION>山西人</OPTION>
</SELECT></TD>
<TD>性别<INPUTid="cz"type="radio"value="cz"checkedname="RadioGroup">男<INPUTid="cz1"type="radio"value="cz1"name="RadioGroup">女</TD>
<TD>增加日期<SELECTid="rq"size="4"name="rq"multiple>
<OPTION>2000年</OPTION>
<OPTION>2003年</OPTION>
<OPTION>2004年</OPTION>
<OPTION>2005年</OPTION>
</SELECT></TD>
</tr>
</table><inputtype=submitvalue=submit>
</form>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</table>
<scriptsrc="OfflineSave.js"></script>
</body>
</html>
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
代码使用说明1970-2270文件夹是保存图像和json文件(也就是需要进行转换的文件)det文件夹是保存单个json对应的txt(因为np.savetxt函数
复制代码代码如下:/**函数名称:DateUtil*作者:yithcn*功能说明:日期函数*使用说明:*创建日期:2010.10.14*/varDateUtil
支付宝的钱怎么转到银行卡支付宝使用说明支付宝的钱怎么转到银行卡支付宝使用说明支付宝的钱怎么转到银行卡支付宝使用说明支付宝的钱怎么转到银行卡支付宝使用说明支付宝的
移除HTML标签复制代码代码如下:$text=strip_tags($input,"");上面的函数主要是使用了strip_tags,具体的使用说明参考。 返
使用说明:程序比较简单,代码中都有说明,这里说说怎么使用。首先是实例化一个Calendar,并设置参数。参数说明:Year:要显示的年份Month:要显示的月份