jquery validate 比較兩個input輸入框的值的大小
好久沒有寫前臺了,專案現在是這個需要,就用了jquery validate控制元件
html程式碼如下:
<th><label for="amountRangeStart">發生額</label></th>
<td>
<s:textfield name="search.amountRangeStart" size="10" id="amountRangeStart" />--
<s:textfield name="search.amountRangeEnd" size="10" id="amountRangeEnd"/>
<span id="amountRangeCheckHf"></span>
</td>
jquery程式碼:
/**
* 資料校驗
*/
$(function (){
jQuery.validator.addMethod("amountLimit", function(value, element) {
var returnVal = false;
var amountStart = $("#amountRangeStart").val();
var amountEnd = $("#amountRangeEnd").val();
if(parseFloat(amountEnd)>parseFloat(amountStart)){
returnVal = true;
}
return returnVal;
},"結束金額必須大於開始金額");
$("#cxtj_form").validate({
rules:{
'search.amountRangeStart':{ maxlength: 16,number:true},
'search.amountRangeEnd': { maxlength: 16,number:true,amountLimit:true }
},
messages:{
"search.amountRangeStart": {number:"請輸入正確的金額"},
"search.amountRangeEnd":{number:"請輸入正確的金額"}
}
});
});
這樣寫好像大體上能滿足要求,但是我前面是自己寫了函式,但是一直時靈時不靈,不知道哪兒出了問題:
$(function (){
$("#amountRangeStart").on("keyup",function(){
var valid = /^\d{0,}(\.\d+)?$/i.test(this.value),val = this.value;
if(!valid){
$("#tradeAmtCheckHf").text( "起始金額輸入只能是數字" );
$( "#tradeAmtCheckHf" ).css({"color": "red"});
}else{
$("#tradeAmtCheckHf").text("");
}
});
$("#amountRangeEnd").on("keyup",function(){
var valid = /^\d{0,}(\.\d+)?$/i.test(this.value),val = this.value;
if(!valid){
$("#tradeAmtCheckHf").text( "起始金額輸入只能是數字" );
$( "#tradeAmtCheckHf" ).css({"color": "red"});
}else{
$("#tradeAmtCheckHf").text("");
}
var tradeAmt_start = $("#amountRangeStart").val();
var tradeAmt_end = $("#amountRangeEnd").val();
if(tradeAmt_start>tradeAmt_end){
$("#tradeAmtCheckHf").text( "結束金額必須大於開始金額" );
$( "#tradeAmtCheckHf" ).css({"color": "red"});
}else{
$("#tradeAmtCheckHf").text("");
}
});
});
希望各位能人志士幫我解惑。。。。