任务5

作者: azure_1122 | 来源:发表于2017-03-20 16:45 被阅读0次

form表单的作用

收集用户提交的数据并提交到后台

常用的input标签及作用

1.type="text",用于输入普通文本
2.type="password",用于输入密码
3.type="checkbox",复选框
4.type="radio",单选按钮
5.type="textarea",可用于输入多行文本
6.type="file",用于传送文件
7.type="hidden",可以用于暂存数据和安全性校验
8."button","submit","reset",依次为自定义功能按钮,提交按钮和重置按钮

post和get的区别

1.提交数据时post不会改变当前url,不会暴露提交的数据,而get会在url中显示提交的数据
2.post提交数据容量远大于get
3.get传输的数据在浏览器记录中可被发现

input中name的作用

可以标识每一段被提交的数据

radio如何分组

采用相同的name属性

placeholder的作用

占位,提示用户输入,不会影响用户输入也不会影响数据提交

type="hidden"的作用

提交一些不需要或者不想被用户看到的参数,或者存放临时值
也可以用于防御CSRF攻击,例如在表单中添加特定数值,在服务器中进行认证,可以避免绝大多数的CSRF攻击

html表单的简单用法

HTML表单是一个包含表单元素的区域, 表单使用<form> 标签创建。表单能够包含 <a target="_blank" title="HTML input 元素,比如文本字段、复选框、单选框、提交按钮等等。
1.表单的属性
action:规定当提交表单时,向何处发送表单数据
method:该属性定义浏览器将表单中的数据提交给服务器处理程序的方式。关于method的取值,最常用的是get和post
target:该属性规定在何处显示action属性中指定的URL所返回的结果
enctype:规定在发送到服务器之前应该如何对表单数据进行编码
2.表单中包含的元素
除了之前提到的各种input标签外还包括复选框select及永福划分区域的fieldset等
3.使用演示(课程任务中的第8项)

<form>
   <div class="username">
      <label for="username">姓名</label>
      <input type="text" name="username">
   </div>
   <div class="password">
      <label for="password">密码</label>
      <input type="password" name="password">
   </div>
   <div class="sex">
      <label>性别</label>
      <input type="radio" name="sex" value="male">男
      <input type="radio" name="sex" value="female">女  
    </div>
    <div class="sex orientation">
      <label>取向</label>
      <input type="radio" name="orientation" value="male">男
      <input type="radio" name="orientation" value="female">女  
    </div>
    <div class="hobby">
      <label>爱好</label>
      <input type="checkbox" name="hobby" value="dota">dota
      <input type="checkbox" name="hobby" value="travel">旅游
      <input type="checkbox" name="hobby" value="pets">宠物
    </div>
    <div class="discuss">
      <textarea placeholder="ddd"></textarea>
    </div>
    <div class="car">
      <label>我的car</label>
      <select name="cars">
        <option value="wanjuche">玩具车</option>
        <option value="yaokongche" selected>遥控车</option>
      </select>
    </div>
    <input type="submit">
</form>

运行结果点这

相关文章

  • 任务5

    form表单有什么作用?有哪些常用的input标签,分别有什么作用? -表单的作用:可以将表单的内容提交到服务器 ...

  • 任务5

    form表单有什么作用?有哪些常用的input 标签,分别有什么作用? 表单在网页中主要负责数据采集功能,form...

  • 任务5

    派送成功,点击这里立即开始! 友情提示:本兼职信息《已通过正规部门审核,公司正规合法,请应聘者放心应聘》 本公司兼...

  • 任务5

    form表单有什么作用?有哪些常用的input 标签,分别有什么作用? form表单用于接收不同类型的用户输入,用...

  • 任务5

    form表单有什么作用?有哪些常用的input 标签,分别有什么作用? 表单在网页中主要负责数据采集功能。一个表单...

  • 任务5

    `# 一 form表单有什么作用?有哪些常用的input 标签,分别有什么作用?HTML 表单用于搜集不同类型的用...

  • 任务5

    问答 1. 样式有几种引入方式? link 和 @import有什么区别? 四种引入方式:使用style属性引入样...

  • 任务5

    1.样式有几种引入方式? link和 @import有什么区别: 1.引用外部样式表:   2.内部样式表:  ...

  • 任务5

    1、form表单有什么作用?有哪些常用的input 标签,分别有什么作用? 表单,这是我们接触动态页面的第一步。表...

  • 任务5

    form表单的作用 收集用户提交的数据并提交到后台 常用的input标签及作用 1.type="text",用于输...

网友评论

      本文标题:任务5

      本文链接:https://www.haomeiwen.com/subject/suxinttx.html