用户输入的重量转换javascript

时间:2016-04-01 16:47:21

标签: javascript type-conversion user-input

我写了一个程序,将lbs转换为kg,它工作正常。我将如何要求用户输入转换。例如,我的重量设置为0.4536,但如果我希望它是用户想要的,我该怎么做?我知道它实际上不会改变,但我正在考虑未来的计划 - 可能是货币转换,其中费率变化,我希望用户轻松输入。

的Javascript

function onlyNumber(fld) {
     if(fld.value.match(/[^0-9.]/)) {
         fld.value=fld.value.replace(/[^0-9.]/g,'');
     }
}

function convertUnit(lbs, kilo) {
    retValue = 0;

    if (isNaN (kilo)) { alert ('Non-numeric value');  return 0; }
        kilo = parseFloat (kilo);
        var factor = 0.4536;

    if (lbs == 'kg2lb') {
         retValue = kilo/factor;
    }

    else if (lbs == 'lb2kg') {
         retValue = kilo*factor;
    }

    return retValue;
}

HTML

<form>
    <table>
        <tr>
            <td>LB<td>
            <input type="text" name="lb" id="lb" onblur="this.form.kg.value=convertUnit('lb2kg',this.value);" onkeyup="onlyNumber(this);">
        </tr>
        <tr>
            <td>KG<td>
            <input type="text" name="kg" id="kg" onblur="this.form.lb.value=convertUnit('kg2lb',this.value);" onkeyup="onlyNumber(this);">
        </tr>
    </table>
</form>

1 个答案:

答案 0 :(得分:0)

添加另一个输入字段或提示用户。

<form>
    <table>
        <tr>
            <td>LB<td>
            <input type="text" name="lb" id="lb" onblur="this.form.kg.value=convertUnit('lb2kg',this.value);" onkeyup="onlyNumber(this);">
        </tr>
        <tr>
            <td>KG<td>
            <input type="text" name="kg" id="kg" onblur="this.form.lb.value=convertUnit('kg2lb',this.value);" onkeyup="onlyNumber(this);">
        </tr>
        <tr>
            <td>Ratio<td>
            <input type="text" name="r" id="r" onkeyup="onlyNumber(this); window.ratio = this.value;">
        </tr>
    </table>
</form>
window.ratio = undefined;

function convertUnit(lbs, kilo) {
    retValue = 0;

    if (isNaN (kilo)) { alert ('Non-numeric value');  return 0; }
        kilo = parseFloat (kilo);

    if (lbs == 'kg2lb') {
         retValue = kilo/window.ratio;
    }

    else if (lbs == 'lb2kg') {
         retValue = kilo*window.ratio;
    }

    return retValue;
}

或者提示

window.ratio = prompt("Which ratio to use ?"); // add validation