灏天阁

数据的验证与传输

· Yin灏

html 表单的内置验证

  • 必填验证
<form id="form01" name="form01" style="text-align: center">
  <h3>个人资料</h3>
  <input type="text" id="username" name="username" placeholde="username" size="16" required>
  <input type="text" id="password" name="password" placeholde="password" size="16" required>
  <p></p>
  <select id="select01" name="select01">
     <option value="">choice of day-off</option>
     <option value="0">0</option>
  </select>
  <button type="submit">Login</button>
</form>

select01.required = true;
  • 字符个数和数值范围的验证
<form id="form01" name="form01" style="text-align: center">
  <h3>个人资料</h3>
  <input type="text" id="username" name="username" placeholder="username" size="16" required>
  <input type="text" id="password" name="password" placeholder="password" size="16" required>
  <input type="number" id="age" name="age" placeholder="age">
  <p></p>
  <select id="select01" name="select01">
     <option value="">choice of day-off</option>
     <option value="0">0</option>
  </select>
  <button type="submit">Login</button>
</form>

username.maxLength = 12;
age.min = 5;
age.max = 10;

- Book Lists -