点击复选框，按钮禁用/启用

长话短说，一个小功能，按钮最开始的时候是禁用，选择复选框后，按钮启用，再点击一下，按钮禁用。

本次使用angularjs混合jquery来使用,先看页面元素;

<div class="form-group">
				<div class="col-sm-12" align="center">
					<input type="checkbox"  ng-click="pitchOn()"> 我已阅读并同意协议条款
					<button class="btn btn-primary" ng-click="addSigningPay()" disabled="disabled"  id="signingPay">签约并支付</button>
				</div>
			</div>

这里按钮使用了disabled,先说一下这个元素;

表单中readOnly和disabled的区别：

Readonly只针对input(text/ password)和textarea有效，而disabled对于所有的表单元素都有效，包括select,radio, checkbox, button等。

但是表单元素在使用了disabled后，当我们将表单以POST或GET的方式提交的话，这个元素的值不会被传递出去，而readonly会将该值传递出去（这种情况出现在我们将某个表单中的textarea元素设置为disabled或readonly，但是submitbutton却是可以使用的）。

js操作：

function disableElement(element,val){
document.getElementById(element).disabled=val;
}

jQuery进行操作：

//两种方法设置disabled属性
$('#areaSelect').attr("disabled",true);
$('#areaSelect').attr("disabled","disabled");
//三种方法移除disabled属性
$('#areaSelect').attr("disabled",false);
$('#areaSelect').removeAttr("disabled");
$('#areaSelect').attr("disabled","");

获取s:textfield，并设置其disabled属性：

functiondisableTextfieldofAccountDiv(element,val) {
$(element).find(":textfield").attr('disabled',val);
}

我们给check框添加了点击事件，后台只要去判断check框是否选中，而更改按钮的disabled属性就OK了;

$("#signingPay").attr("disabled",!$("input[type='checkbox']").is(':checked'));