如何使用javascript / jquery启用文本框接受十进制值

时间:2013-01-07 15:56:50

标签: javascript jquery

我使用javascript和html创建了一个小应用程序。

但是最近我遇到了我的脚本问题。

问题:输入文本框不允许我输入(。)点/句点,即十进制值。示例:如果我输入一个十进制值,那么它将自动从我的输入文本框中删除。

这可能是什么原因。

我试图从最近3小时解决这个问题。但是找不到确切的问题。请检查我的代码并帮助我解决这个问题。

相关代码:

<table border="0">
    <form name="form_A" onsubmit="return false">
        <tr>
            <td>
                <select name="unit_menu" class="Items" onchange="CalculateUnit(this.form, document.form_B)">
                    <option>
                    ------- Select a Property -------
                                                                    <option>
                    <option>
                    <option>
                    <option>
                    <option>
                </select>

            </td>
            <td>
                <input type="text" id="info" name="unit_input" placeholder="Type to convert" class="textbox" onfocus="CalculateUnit(this.form, document.form_B)" onkeyup="CalculateUnit(this.form, document.form_B)"></td>

        </tr>
    </form>
    <form name="form_B" onsubmit="return false">
        <tr>

            <td>
                <select name="unit_menu" class="Items" onchange="valuefocus()">
                    <option>
                    ------- Select a Property -------
                    <option>
                    <option>
                    <option>
                    <option>
                    <option>
                </select></td>
            <td>
                <input type="text" name="unit_input" size="20" maxlength="20" placeholder="Type to convert" class="textbox" onfocus="CalculateUnit(this.form, document.form_A)" onkeyup="CalculateUnit(this.form, document.form_A)"></td>
            <td></td>
        </tr>
    </form>
</table>

的Javascript

         function CalculateUnit(sourceForm, targetForm){
            // A simple wrapper function to validate input before making the conversion
            var sourceValue = sourceForm.unit_input.value;

            // First check if the user has given numbers or anything that can be made to
            // one...
            sourceValue = parseFloat(sourceValue);
            if ( !isNaN(sourceValue) || sourceValue == 0){
                // If we can make a valid floating-point number, put it in the
                // text box and convert!
                sourceForm.unit_input.value = sourceValue;
                ConvertFromTo(sourceForm, targetForm);
            } else {
                 //wrong input
            }
        }

1 个答案:

答案 0 :(得分:1)

您的问题是您的转化功能是在关键字上触发的,因此如果用户输入3.,则会将其转换为3并重新投放到该字段中。

parseFloat(3.) = 3

有几种方法可以解决这个问题。

最简单的方法是不计算keyup上的值,但是当用户点击enter或字段失去焦点时(blur)。

其他选项是检查字段的字符串值,如果它在解析之前以.结尾,并且只要它不是有效数字就保持不变。

示例:

function CalculateUnit(sourceForm, targetForm){

    // A simple wrapper function to validate input before making the conversion
    var sourceValue = sourceForm.unit_input.value;

    // First check if the user has given numbers or anything that can be made to
    // one...
    if (!/\.$/.test(sourceValue)) {
        sourceValue = parseFloat(sourceValue);
        if ( !isNaN(sourceValue) || sourceValue == 0){
            // If we can make a valid floating-point number, put it in the
            // text box and convert!
            sourceForm.unit_input.value = sourceValue;
            ConvertFromTo(sourceForm, targetForm);
        } else {
             //wrong input
        }
    } else {
        // sourceValue ends with a '.'
    }
}