<!DOCTYPE html>
使用表单事件
<form action="post" method="get">
<label><input name="" type="radio" value="" id="terms" onclick="chkRadio(this)" />Check to agree to terms &
conditions</label>
<p id="termsHint"></p>
<input type="submit" name="" id="formSignup" value="NEXT" />
</form>
<script type="text/javascript">
var elForm, elSelectPackage, elPackageHint, elTerms;
var flag = true;
elForm = document.getElementById('formSignup');
// elSelectPackage = document.getElementById('package');
// elPackageHint = document.getElementById('packageHint');
elTerms = document.getElementById('terms');
elTermsHint = document.getElementById('termsHint');
// function packageHint() {
// var package = this.options[this.selectedIndex].value;
// if (package == 'monthly') {
// elPackageHint.innerHTML = 'Are you sure??';
// } else {
// elPackageHint.innerHTML = 'Wise choice!';
// }
// }
function chkRadio(id) {
id.checked = flag;
flag = !flag;
}
function checkTerms(event) {
if (!elTerms.checked) {
elTermsHint.innerHTML = 'You must agree to the terms.';
event.preventDefault();
}
}
elForm.addEventListener('submit', checkTerms, false);
elSelectPackage.addEventListener('change', packageHint, false);
</script>
</div>
</body>
