解決方法:默認不為文本域添加disabled和readonly等屬性,在其獲取焦點時添加相應屬性,失去焦點時再移除。這樣就不影響jquery validation的校驗了。
之所以默認不添加,是因為如果用戶不進行點擊操作,jQuery validation還是不進行校驗的。
如下:
<div class="form-group">
<label><span class="red">*</span>家庭月綜合收入(自動計算)</label>
<input type="number" class="form-control" name="incomefamily" readonly_="readonly" autocomplete="off" placeholder="">
</div>
注意,我這里默認為文本域添加了自定義的readonly_屬性(注意后面有下劃線),這樣方便使用jQuery選擇器批量選擇。
然后為其添加事件:
$("input").each(function(){
if($(this).attr("readonly_")=="readonly"){
$(this).on("focusin", function() {
$(this).prop('readonly', true);
});
$(this).on("focusout", function() {
$(this).prop('readonly', false);
});
};
});
$("textarea").each(function(){
if($(this).attr("readonly_")=="readonly"){
$(this).on("focusin", function() {
$(this).prop('readonly', true);
});
$(this).on("focusout", function() {
$(this).prop('readonly', false);
});
};
});