• 1、form

    只要是涉及向服务器提交信息,都应该使用form。

    基本语法结构:

    <form action="目标文件" method="get|post">

      各种表单元素

    </form>

    action属性决定的目标文件来对用户提交的信息进行处理。

    2、常用的表单元素

       单行文本框:用于输入少量的信息。
       基本语法格式:
       <input type="text" name="名字" value="值">
       type="text"就说明这是单行文本框;
       name指出文本框的名字,最好不要用汉字,最好使用有意义的名字;
       value指出默认值,如果没有默认值,可以不要value属性,value属性经常在修改的时候使用。
       注意:如果有格式要求,要明确的告诉用户。


       密码框:用于输入密码。
       基本的语法格式:
       <input type="password" name="名字" value="值">
       注意:设置密码的时候,应该使用确认密码,应该有两个密码框。


       提交按钮:当点击它的时候,会把输入的信息提交给服务器。
       基本语法格式:
       <input type="submit" value="值">
       type应该为submit,value是显示在按钮上面的信息。

      
       复位按钮:当点击它的时候,会把各个表单元素的值恢复到默认值。
       基本语法格式:
       <input type="reset" value="值">
      

       普通按钮:也可以完成提交,还可以完成方法的调用。
       基本语法格式:
       <input type="button" value="值">


       单选按钮:通用用于在多个选项中选择一个。
       基本语法格式:
       <input type="radio" name="名字" value="值">
       这个表示一个单选按钮,并且仅仅是一个按钮。
       例,选择性别:
       <input type="radio" name="sex" value="1" checked>男
       <input type="radio" name="sex" value="0">女
       如果希望在多个选项中选择一个(有互斥性),必须让他们的名字一致。


       复选框:用于多选。
       基本的语法格式:
       <input type="checkbox" name="名字" value="值">
       显示给用户的信息与提交给服务器的信息没有关系。
       如果希望多个选项是一组,应该使用相同的名字。


       下拉列表:用于选择,可以单选,也可以多选。
       基本语法格式:
       <select name="名字">
          <option value="1" selected>1</option>
          <option value="2">2</option>
          ...
       </select>
       每个选项使用一个option,使用value属性指出该选项的值,在<option>和</option>之间是显示给用户的值。


       文本域:用于输入大量的信息。
       基本语法格式:
       <textarea name="名字" cols="列数" rows="行数">
         默认值
       </textarea>
       要为这个文本域赋默认值,需要把值放在开始标志和结束标志之间,而不是使用value属性。

    3、完成输入的时候应该注意的问题
       对格式的要求必须明确,包括长度、数字、日期、email、电话、必添。
       能够从系统中获取的信息不要让用户提供,例如当前时间。
       能够选择的信息不要让用户输入。
       按照信息的重要程度安排表单元素在界面中的位置。

    4、对用户输入信息进行验证
       要用JavaScript,使用下面的标记:
       <script language="javascript">
          //JavaScript代码
       </script>

       要写方法
       function check(){
       }
       方法可以不用定义返回值,但是可以有返回值

       获取用户输入的值:
       document.form1.username.value
       document表示当前文档,form1表示表单的名字,username表示该表单中表单元素的名字,value表示得到值

       把表单提交与方法关联:可以使用表单的onSubmit事件。
       onSubmit="return check();"

       例:
    <script language="javascript">
       function check(){
          username = document.form1.username.value;
          if(username.length<6 || username.length>8){
             alert("用户名长度不合适!");
             return false;
          }else{
             return true;
          }
       }
    </script>

       使用button的onClick事件进行验证:
       首先要把提交按钮修改成普通按钮;
       在普通按钮上增加事件:onClick="javascript:check()" 
       在验证成功的时候,提交表单:document.form1.submit();

  • 相关阅读:
    java
    GO学习Day2
    GO学习Day1
    APS定时任务框架
    用微信每天给女朋友说晚安
    人生苦短,我用python
    Python 捕获terminate信号优雅关闭进程
    Python 多线程及多进程结合使用
    Python API 接口权限控制思路
    Docker runC 严重安全漏洞CVE-2019-5736 导致容器逃逸
  • 原文地址:https://www.cnblogs.com/caicaidandan/p/4718436.html
Copyright © 2020-2023  润新知