<form action="">
<fieldset>
<legend>学生档案</legend>
<label for="userName">姓名：</label>
<input type="text" name="userName" id="userName" placeholder="请输入您的姓名"/>
<label for="userPhone">手机号码：</label>
<input type="tel" name="userPhone" id="userPhone" pattern="^1\d{10}$"/>
<label for="email">邮箱地址：</label>
<input type="email" required name="email" id="email" pattern="^1\d{10}$"/>
<label for="school">所属学院：</label>
<input type="text" name="school" id="school" list="college"/>
<datalist id="college">
<option>html</option>
<option>css</option>
<option>javascript</option>
</datalist>
<label for="score">入学成绩：</label>
<input type="number" name="score" id="score" max="100" min="0" value="0" />
<label for="level">基础水平：</label>
<meter max="100" min="0" id="level" low="59" high="89" />
<label for="inTime">入学日期：</label>
<input type="datetime-local" name="inTime" id="inTime" />
<label for="leaveTime">毕业日期：</label>
<input type="datetime-local" name="leaveTime" id="leaveTime"/>
<input type="submit"/>
</fieldset>
</form>
<script>
document.getElementById("score").oninput=function () {
document.getElementById("level").value=this.value;
};
</script>
