css實現_刷新頁面的同時保存頁面控件的輸入值

發布時間:2017-06-11 12:00 來源:互聯網 當前欄目:網頁設計教程

 css實現刷新頁面的同時保存頁面控件的輸入值這個對于我們來講是非常好用了,像有些頁面不小心刷新了頁面表單值就丟失了需要重新輸入非常的麻煩,那么我們可以使用css來定義頁面刷新值保存起來,具體設置如下。

  

在Head中加入<meta name="save" content="history">

添加css: input{behavior:url(#default#savehistory)};

e.g. 頁面上存在<input type=text id="txttestsavehistory"/>

給 input輸入值后刷新頁面看看,輸入的值還在

例子

 代碼如下  

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<meta name="save" content="history">
<title></title>
<mce:style type="text/css"><!--
input{behavior:url(#default#savehistory)};
--></mce:style><style type="text/css" mce_bogus="1">input{behavior:url(#default#savehistory)};</style>
</head>
<body>
<DIV style="float:left" mce_style="float:left">
<ul>
<li><label style="width:100px">hhhhh</label><input type="text" ></li>
<li><label style="width:100px">sssssssssss</label><input type="text" > </li>
</ul>
</DIV>

還有一種真正的實現辦法就是js ajax保存草稿功能

首先是表單頁面:

 代碼如下  

<!-- 編寫文章的文本域 -->
<textarea cols="10" rows="6" id="content"></textarea&g

qq傷感網名[www.la240.com/html2017/1/6/]
t;
<!-- AutoSaveMsg顯示返回信息 -->
<div id="AutoSaveMsg"></div>
<input type="button" onclick="AutoSaveRestore();" value="恢復最后保存的草稿">

<!-- 將JS代碼放在所有對象之后,以免在頁面未加載完成時出現對象不存在的錯誤 -->
<!-- AJAX類 -->
<script type="text/javascript" src="ajaxrequest.js"></script>
<!-- 自動保存代碼 -->
<script type="text/javascript" src="autosave.js"></script>

=====以下代碼存成autosave.js=====

 代碼如下  
  • 1、
  • 2、
  • 3、
  • 4、
  • 5、
  • 6、
  • 7、
  • 8、
  • 9、
  • 10、
  • 11、
  • 12、
  • 13、
  • 14、
  • 15、
  • 16、
  • 17、
  • 18、
  • 19、
  • 20、
  • 21、
  • 22、
  • 23、
  • 24、
  • 25、
  • 1、
  • 2、
  • 3、
  • 4、
  • 5、
  • 6、
  • 7、
  • 8、
  • 9、
  • 10、
  • 11、
  • 12、
  • 13、
  • 14、
  • 15、
  • 16、
  • 17、
  • 18、
  • 19、
  • 20、
  • 21、
  • 22、
  • 23、
  • 24、
  • 25、