iview select清空选择_HTML -- 表单标签\input\select

Ⅰ 简介

• 语义：标记表单
• 表单就是专门用来接收用户输入或采集用户信息的

Ⅱ 表单的格式

• 表单基本格式
  • <form>
    <表单元素>
    </form>
• action三种参数 -- 控制数据提交的后端路径
  • action='' -- 默认就是朝当前页面所在的url提交数据
  • action='全路径' -- 朝指定服务端提交
  • action="/index/" -- 自动识别当前服务端的ip和port拼接到前面
• <form action="http://127.0.0.1:8080/" method="post">
  • 向指定本地端口请求,以post模式请求

Ⅲ input -- 标签

• 描述性信息:<input type="数据类型">
• 用户名:<input type="text"> -- text普通文本

<form action="">
    用户名:<input type="text">
</form>

• placeholder='提示信息' -- 输入框提示信息

<form action="">
    用户名:<input type="text" placeholder='请输入用户名'>
</form>

• password -- 密文格式,一般用于密码

    <p>
        密码:<input type="password" placeholder='请输入密码'>
    </p>

• date -- 日历格式,用于出生日期快捷输入

    <p>
        出生日期:<input type="date">
    </p>

• submit -- 向后端提交数据,当没有指定文本内容,不同的浏览器打开之后文本不一样

    <p>
        <input type="submit" >   -- 谷歌浏览器默认为提交
    </p>

    <p>
        <input type="submit" value="确定">   -- 指定显示为确定按钮
    </p>

• button -- 可以触发submit的功能

<p>
    <button>点我提交</button>
</p>

三个按钮都可以提交数据

• reset -- 清空输入按钮

    <p>
        <input type="reset" value="清空已输入数据">
    </p>

• radio -- 点选式单选,name值需要统一

    <p>
        性别:<input type="radio" name="gender">男
        <input type="radio" name="gender">女
        <input type="radio" name="gender">其他
    </p>

• checkbox -- 点选式多选,及默认值
• checked = 'checked' -- 默认值

    <p>
        性别:<input type="radio" name="gender" checked="checked">男  -- 默认选项
        <input type="radio" name="gender">女
        <input type="radio" name="gender">其他
    </p>
    <p>
        爱好:<input type="checkbox" checked="checked">多人运动  -- 默认选项
        <input type="checkbox" >拼刺刀
        <input type="checkbox" checked="checked">磨镜
    </p>

Ⅲ select -- 标签

• select -- 下拉框式选择
• option -- 默认单选

        <select name="" id="">
            <option value="城市">湖边的角逐</option>
            <option value="城市">阿拉曼机场</option>
            <option value="城市">烈焰丘陵</option>
        </select>

• multiple -- 下拉框式选择多选模式,多选需要shift按下
• selected -- 默认选项

    <p>
        <select name="" id="">
            <option value="城市">湖边的角逐</option>
            <option value="城市">阿拉曼机场</option>
            <option value="城市"  selected="selected">烈焰丘陵</option>
        </select>
    </p>

    <p>
        <select name="" id="" multiple>
            <option>卡累利阿</option>
            <option>马利诺夫卡</option>
            <option selected="selected">普罗霍洛夫卡</option>
            <option selected="selected">锡默尔斯多夫</option>
            <option>拉斯威利</option>
        </select>
    </p>

Ⅳ textarea -- 获取大段文本

• textarea -- 用于企鹅空间说说等

    <p>
        <textarea name="说说" id="" cols="30" rows="10">
        </textarea>
    </p>

textarea标签属性有cols、rows、name、style、class、disabled、readonly，
在HTML5中新增了autofocus、form、maxlength、placeholder、required、wrap。

cols：规定文本区内的可见宽度。
rows：规定文本区内的可见行数。
name：规定文本区的名称。
style：css样式。
class：class样式。
disabled：规定禁用该文本区。
readonly：规定文本区为只读。
autofocus：规定在页面加载后文本区域自动获得焦点。
form：规定文本区域所属的一个或多个表单。
maxlength：规定文本区域的最大字符数。
placeholder：规定描述文本区域预期值的简短提示。
required：规定文本区域是必填的。
wrap：规定当在表单中提交时，文本区域中的文本如何换行。