• 带记忆功能的表单


    带记忆功能的表单

     

    在一般情况下,用户提交表单后,将会跳转到另一个页面,同时表单中的内容也会清空。而有时为了简化操作步骤,需要保留历史信息,即当用户再返回原来页面时,还可以看到刚才所填写的信息。以下实例,当用户刷新或者单击“确定”按钮提交表单后再退回到原来页面时,文本框中的内容将保持不变。如下图所示:

    本实例主要是通过在css样式定义中,设置behavior确定对象的行为,并设置<meta>元信息标记中的name属性和content属性来实现保留历史信息的功能。<meta>标记是用来在HTML文件中模拟HTTP协议的响应头报文,是实现元数据的主要标记,它可以用于鉴别作者、标注内容提要和关键字、设定页面字符集、刷新页面等。在HTML文档头部可以包括任意数量的<meta>标记。

    实现带记忆功能的表单的关键代码如下:

    复制代码
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <meta name="save" content="history">
    <title>带记忆功能的表单</title>
    <style type="text/css">
    <!--
    .style1 {color: #FFFFFF}
    input{
        font-family: "宋体";
        font-size: 9pt;
        color: #333333;
        border: 1px solid #999999;
    }
    
    .saveHistory{
    behavior:url(#default#savehistory);
    }
    -->
    </style>
    </head>
    <body style="font-size:12px">
    <form name="form1">
      <table width="500" border="0" align="center" cellpadding="0" cellspacing="1" bgcolor="#FF9900">
        <tr>
          <td height="22" colspan="4"><span class="style1" style="font-weight:bolder">&nbsp;&nbsp;添加商品信息</span></td>
        </tr>
        <tr align="left" bgcolor="#FFFFFF">
          <td height="22">商品名称:</td>
          <td height="22" colspan="3"><input name="textfield" type="text" class="wenbenkuang" size="35"></td>
        </tr>
        <tr align="left" bgcolor="#FFFFFF">
          <td height="22">商品规格:</td>
          <td height="22"><input name="textfield2" type="text" class="wenbenkuang"></td>
          <td height="22">计量单位:</td>
          <td height="22"><input name="txt_unit" type="text" class="saveHistory" id="txt_unit"></td>
        </tr>
        <tr align="left" bgcolor="#FFFFFF">
          <td height="22">供应商:</td>
          <td height="22" colspan="3"><input name="txt_co" type="text" class="saveHistory" id="txt_co" size="35"></td>
        </tr>
        <tr align="left" bgcolor="#FFFFFF">
          <td height="22">出厂日期:</td>
          <td height="22" colspan="3"><input name="textfield5" type="text" class="wenbenkuang"></td>
        </tr>
        <tr align="left" bgcolor="#FFFFFF">
          <td height="22">&nbsp;</td>
          <td height="22" colspan="3"><input type="button" name="Submit" value="确定" onClick="javascript:window.location.href='test.htm';">
          &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
          <input type="reset" name="Submit2" value="重置"></td>
        </tr>
      </table>
    </form>
    </body>
    </html>
  • 相关阅读:
    解决SharePoint 2010拒绝访问爬网内容源错误
    Sharepoint 2010 工作流状态值
    修改任务显示WrkTaskIp.aspx页面
    Infopath 2013 通过UserProfileService读取AD用户信息
    js验证
    .net中下载文件的方法(转)
    IIS限制ASP.Net 文件上传大小解决方案,修改IIS7/7.5配置
    SharePoint2013 SharePoint-Hosted 模式 分页方法
    技术QQ群
    react学习
  • 原文地址:https://www.cnblogs.com/shoupifeng/p/2811548.html
Copyright © 2020-2023  润新知