文本框僅接受十進制值，並應在十進制后附加2個零

Question

我正在驗證頁面上有3個文本框的中間。 第一個用於選擇日期的文本框，第二個用於插入十進制值的文本框，第三個用於插入十進制值的文本框。

實際上，我實際上正在嘗試的是，如果假設用戶輸入一些值，例如123而不是123.00，則文本框本身應在用戶插入的值的末尾附加.00以使其為十進制。 這是我的Javascript代碼

$(document).ready(function () {
});

function ValidateAddNewCourseCharge() {
var EffectiveDate = $.trim($("[id$='txtFromDate']").val());
var AdminCharge = $.trim($("[id$='txtAdminCharges']").val().attr("#.00"));
var OtherCharge = $.trim($("[id$='txtOtherCharges']").val().attr("#.00"));

isValidDate(EffectiveDate);
if (EffectiveDate == "__-__-____") {
    showErrorMessagePopUp("Please select Date!");
    return false;
}
else {
    if (isValidDate(EffectiveDate) == false) {
        showErrorMessagePopUp("Please Select Valid Date for Course Amount!");
        return false;
    }
}

if (AdminCharge == "") {
    showErrorMessagePopUp("Please Enter Admin Charge!");
    return false;
}
else {
    if (isValidPrice(AdminCharge) == false) {
        showErrorMessagePopUp("Please Enter Valid Admin Amount!");
        return false;
    }
    if (AdminCharge == checkPrice(AdminCharge))
    {
        showErrorMessagePopUp("Please Enter Valid Admin Amount!");
        return false;
    }
}

if (OtherCharge == "") {
    showErrorMessagePopUp("Please Enter Other Charge!");
    return false;
}
else {
    if (isValidPrice(OtherCharge) == false) {
        showErrorMessagePopUp("Please Enter Valid Other Amount!");
        return false;
    }
    if (OtherCharge == checkPrice(OtherCharge)) {
        showErrorMessagePopUp("Please Enter Valid Other Amount!");
        return false;
    }
}
return true;
}

function isValidDate(number) {
var regex = /^(0?[1-9]|[12][0-9]|3[01])[\/\-](0?[1-9]|1[012])[\/\-]\d{4}$/
return regex.test(number);
}

function isValidPrice(number) {
var regex = /^\d{0,12}(\.\d{0,2})?$/
return regex.test(number);
}

function checkPrice(el) {
var ex = /^[0-9]+\.?[0-9]*$/;
el.value = parseFloat(el.value).toFixed(2);
if (ex.test(el.value) == false) {
    el.value = '';
}
}

我在單擊按鈕時調用此函數。

<asp:Button ID="btnAddCharge" runat="server" CssClass="btn btn-success"  OnClick="btnAddCharge_Click" OnClientClick="return ValidateAddNewCourseCharge();" />

Answer 1

我上個星期也有類似的問題

這就是我想出的（depthUnit在其他位置設置，例如“ m”或“ ft”）

function manageUnitField(inputBox) {
$(inputBox).on("blur", function() {  //clicking off the inputbox causes the formatting
    var value = ($(this).val()).replace(/[^0-9\.]+/g, ''); //remove non-numeric and keep decimals decimals
    var i = 0; //
    value = value.replace(/\./g, function() { return i++ === 0 ? '.' : ''; }); //remove all but the first decimal
    value = value.replace(/^0+/, ''); // remove leading zeroes 
    // append depth unit
    if (value == "") {
        value = 0 + depthUnit;
    } else value = value + depthUnit;
    if (value.indexOf('.') == 0) {
        value = 0 + value;
    }
    $(this).val(value);
}).focus(function() {
    if ($(this).val() == 0 + depthUnit) {
        $(this).val('');
    }
});

}

如果沒有任何小數位或小數點后沒有任何內容，則基本上可以使用depthUnit示例附加“ .00”

編輯

你也可以使用

Math.round(number*100)/100

四舍五入到小數點后兩位

Answer 2

您可以按照以下方式進行操作。 請記住，這是一個演示 ，您需要對其進行調整以適合您的需求。

 $("[name='number-only']").on("change", function() { var val = this.value; if (val.match(/\\./g)) { //See if it already has a dot if (val.replace(/\\./g, "").match(/^\\d+$/) !== null) { //Check if it's number after removing the dot this.value = parseFloat(val, 10).toFixed(2); //Yes, so format number } else { //Not a number, so reset the input value //Log a msg if need be: "Only numbers allowed!"; this.value = ""; this.focus(); } } else { //No dot found, so, see if it's a number if (val.match(/^\\d+$/) !== null) { this.value = parseFloat(val, 10).toFixed(2); //Yes, so format number } else { //Not a number, so reset the input value //Log a msg if need be: "Only numbers allowed!"; this.value = ""; this.focus(); } } }); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" name="number-only" /> 

Answer 3

function ValidateAddNewCourseCharge() {    
var AdminCharge = $.trim($("[id$='txtAdminCharges']").val());
var OtherCharge = $.trim($("[id$='txtOtherCharges']").val());
isValidDate(EffectiveDate);

if (AdminCharge == "") {
    showErrorMessagePopUp("Please Enter Admin Charge!");
    return false;
}
else {
    if (IsNumeric(AdminCharge)) {
        AdminCharge = parseFloat(AdminCharge).toFixed(2);
    }
    else {
        showErrorMessagePopUp("Admin Charge is not Valid. Please try again!");
        AdminCharge = "";
        return false;
    }
}

if (OtherCharge == "") {
    showErrorMessagePopUp("Please Enter Other Charge!");
    return false;
}
else {
    if (IsNumeric(OtherCharge)) {
        OtherCharge = parseFloat(OtherCharge).toFixed(2);
    }
    else {
        showErrorMessagePopUp("Other Charge is not Valid. Please try again!");
        OtherCharge = "";
        return false;
    }
}    
return true;
}

function IsNumeric(input) {
var RE = /^-{0,1}\d*\.{0,1}\d+$/;
// var RE = /^-{0,1}\d*\.{0,1}\d{2}$/; To Enable user to enter only decimal number
return (RE.test(input));
}

這項工作很好...