例① ：输入框必填，用*号提示
<p class="form-group"><label for="author">姓名</label> <span class="required" style="color:red">*</span><br><input type="text" id="author" name="author" required="required" size="15" class="form-text"></p>
页面效果：
例②：javascript 验证单选框为必选
<form name="from1"><p>请选择你的性别</p><input type="radio" id="male" name="sex" value="1">男<input type="radio" id="female" name="sex" value="2">女<br /><button type="button" onclick="check();">确定</button></form><script type="text/javascript">function check() {if (!document.getElementById("male").checked && !document.getElementById("female").checked) {alert("必须选择性别！")return false;}}</script>
页面效果：
例③：javascript 根据后台的值默认选中单选按钮
<form id="form1"><input type="radio" name="sex" value="1" />男<input type="radio" name="sex" value="2" />女</form><script>var sex = document.getElementsByName('sex');for (var i = 0; i < sex.length; i++) {if (sex[i].value == '1') {sex[i].checked = 'checked';}}</script>
页面效果：
例④：点击禁用表单输入域
首先在head里引入angular.js
<script src="https://cdn./libs/angular.js/1.4.6/angular.min.js"></script>
body里的代码：
点击这里禁用所有表单输入域:<input type="checkbox" ng-model="a"><br><br><input type="text" ng-disabled="a"><input type="radio" ng-disabled="a"><select ng-disabled="a"><option> Female</option><option>Male</option></select><script>var aa = document.querySelector('input');console.log();</script>
页面效果：
例⑤：输入框变为只读
首先在head里引入jquery.js
<script src="/jquery/3.4.1/jquery.js"></script>
body里的代码：
<div id="aaa" style="height: 20px;"><input type="text"><input type="text"><input type="text"></div><script>$('#aaa input').attr('disabled',true); // 直接变暗，只读的视觉效果很好.// $('#aaa input').attr('readonly',true); // 无法输入任何内容，但是只读的视觉效果不明显 </script>
页面效果：
disbaled出现的效果：
readonly出现的效果：
input框的一系列操作(输入框必填*号 验证单选框为必选 默认选中单选按钮 点击禁用表单输入域 输入框变为只读)
