继续浏览精彩内容
慕课网APP
程序员的梦工厂
打开
继续
感谢您的支持,我会继续努力的
赞赏金额会直接到老师账户
将二维码发送给自己后长按识别
微信支付
支付宝支付

简单介绍HTML表单的用法

holdtom
关注TA
已关注
手记 1842
粉丝 240
获赞 991

1.工作机制

webp

2012080516253421.jpg

2.表单定义

  • HTML表单是一个包含表单元素的区域, 表单使用

3.结构

<from action='/abc.php' method='post/get'>    
    <input type=''>
    <texttarea></texttarea>
    <select name=''>
          <option value='' select='select'>
           <option>
    </select></from>

4.表单属性

<from>包裹表单控件形成完整数据进行后台提交

  • action访问文件地址

  • method 访问类型

<label for='关联元素的id'></label>

<input type='' placeholder='H5新增默认展示文本'>

  • type

    • 暂存信息

    • 安全:通过后台传来的校验键值,保存在hidden的name和value中,当用户提交表单后后台校验这个键值,从而防止模拟攻击

    • hidden的总结

    • 通过accept='image/png',来限定只能点选的文件

    • 通过添加value值去获取,如<input type='radio' value='xxx'>

    • 通过name去判断是否在同一组单选

    • 通过设置checked='checked'变成默认项

    • 通过添加value值去获取,如<input type='checkbox' value='xxx'>

    • placeholder:属性提供可描述输入字段预期值的提示信息(hint)。该提示会在输入字段为空时显示,并会在字段获得焦点时消失。

    • text  文本输入框

    • password  密码输入框

    • checkbox  多选框

    • radio 单选框

    • file 文件上传

    • hidden

    • button 提交按钮

    • submit 提交按钮

    • reset  重置按钮

<select>下拉菜单

* <select name=''><option value='' select='select'></select>             * name代表键
* select默认选项

<textarea></textarea>多行文本



作者:饥人谷_米弥轮
链接:https://www.jianshu.com/p/7df3c7097754


打开App,阅读手记
0人推荐
发表评论
随时随地看视频慕课网APP