JavaScript---验证表单元素是否被修改

<form>
	<input type="text" value="defaultValue 1"/>  

	<input type="text" value="defaultValue 2"/>  

	<textarea >defaultValue 1</textarea>  

	<textarea >defaultValue 2</textarea>  

	<input type="radio" name="a" />test
	<input type="radio" name="a" checked="checked"/>defaultChecked  

	<input type="checkbox"  name="b"/>test
	<input type="checkbox"  name="b" checked="checked"/>defaultChecked
	<input type="checkbox"  name="b" checked="checked"/>defaultChecked  


	<select>
		<option selected="selected">defaultSelected 1</option>
		<option>test</option>
		<option>test</option>
		<option>test</option>
	</select>  


	<select multiple="multiple">
		<option>test</option>
		<option selected="selected">defaultSelected 1</option>
		<option selected="selected">defaultSelected 2</option>
		<option>test</option>
	</select>  


	<input type="button" οnclick="IsFormChanged()" value="submit"/>
</form>
<script>
function IsFormChanged() {
	var isChanged = false;
	var form = document.forms[0];
	for (var i = 0; i < form.elements.length; i++) {
		var element = form.elements[i];
		var type = element.type;
		if (type == "text" || type == "hidden" || type == "textarea" || type == "button") {
			if (element.value != element.defaultValue) {
				isChanged = true;
				break;
			}
		} else if (type == "radio" || type == "checkbox") {
			if (element.checked != element.defaultChecked) {
				isChanged = true;
				break;
			}
		} else if (type == "select-one"|| type == "select-multiple") {
			for (var j = 0; j < element.options.length; j++) {
				if (element.options[j].selected != element.options[j].defaultSelected) {
					isChanged = true;
					break;
				}
			}
		} else { 
			//  etc...
		}     
	}    
	alert( isChanged?"你改变了表单的默认值.":"成功提交.");
	return isChanged;
}
</script>

 有2点注意
1,表单元素都有默认值属性,比如element.defaultValue , element.defaultChecked  ,element.options[j].defaultSelected

2,select元素的type类型是:""select-one"或者"select-multiple",而不是"select"。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值