【H5】H5新增input属性

  1. placeholder 占位提示
     <input  placeholder="请输入XXXX">

  2. autofocus 自动获取焦点
     <input autofocus>
  3. autocomplete 自动提示
     <form action="">
          <!--  前提1.成功提交;2.必须有name属性-->
          <!--  on 打开 off关闭-->
          <input name="name" autocomplete="on">
          <button type="submit">sub</button>
        </form>

  4. required 必填字段,如果缺失阻止提交
     <form action="">
          <input name="tel" required>
          <button type="submit">sub</button>
        </form>

  5. pattern 正则验证
    <form action="">
          <!--验证手机号-->
          <input name="tel" pattern="^(\+86)?1\d{10}$">
          <button type="submit">sub</button>
        </form>

  6. multiple type为file时可选择多个文件,email时可传多邮箱(以“,”分割)
     <!--选择多个文件-->
          <input type="file" multiple>
    <form action="">
              <input name="email" type="email" multiple>
              <button type="submit">sub</button>
            </form>
  7. from 表单外按钮 指定表单进行提交
    <form action="" id="f1">
          <input name="email" type="email" multiple>
        </form>
        <button type="submit" form="f1">sub</button>
发布了47 篇原创文章 · 获赞 4 · 访问量 7478

猜你喜欢

转载自blog.csdn.net/weixin_39370093/article/details/100030153