цифра Изменения по умолчанию в текстовом поле через выпадающее меню

Question

Я работаю на этой странице - http://www.medilogicuk.com/v1/products/calculate-savings/

Это простой калькулятор, который вычисляет сбережения. В настоящий момент значения по умолчанию в входах «Фармацевт» & «Диспенсер/Техник» представляют собой цифры в год, когда пользователь нажимает на выпадающее меню и выбирает «в час». Я хочу, чтобы цифры автоматически менялись в час (через простой расчет) ... и наоборот. Входу необходимо (перечислить) подсчет любого числа, которое вводит пользователь, поэтому, если они войдут в 50.00 и будут меняться в год, то показатель за год должен отражать это.

Как я мог реализовать это?

Вот мой код, чтобы создать эту таблицу:

<table border="0"> 
    <tr> 
    <td colspan="3"><h3>Current service costs</h3></td> 
    </tr> 
    <tr> 
    <td width="440"><p>Pharmacist</p></td> 
    <td><p style="padding-left:5px!IMPORTANT;">&pound; 
     <input value="42500" type="text" name="pharmacist" /> 
     </p></td> 
    <td width="5" rowspan="2"><select> 
     <option value="perannum">per annum</option> 
     <option value="perhour">per hour</option> 
     </select></td> 
    </tr> 
    <tr> 
    <td><p>Dispenser/Technician</p></td> 
    <td><p style="padding-left:5px!IMPORTANT;">&pound; 
     <input value="17500" type="text" name="dispenser" /> 
     </p></td> 
    </tr> 
    <tr> 
    <td colspan="3">&nbsp;</td> 
    </tr> 
</table> 

Answer 1

выработала решение для Вас: http://jsfiddle.net/tive/Gya43/

Javascript

$(function() { 
    $('#ddlDuration').change(function() { 
     var pharmacist = $('#pharmacist'); 
     var dispenser = $('#dispenser'); 

     if ($(this).val() == 'perhour') { 
      pharmacist.val(toHour(pharmacist.val())); 
      dispenser.val(toHour(dispenser.val())); 
     } else { 
      pharmacist.val(toAnnual(pharmacist.val())); 
      dispenser.val(toAnnual(dispenser.val())); 
     } 
    }); 

    function toHour(annumRate) { 
     var num = (annumRate/8760); 
     return num.toPrecision(annumRate.length); 
    } 

    function toAnnual(hourRate) { 
     var num = (hourRate * 8760); 
     return num.toFixed(0); 
    } 
}); 

Если вы столкнетесь с проблемами с num.toFixed (2) попробуйте num.toPrecision (2), так как это будет более точным.

EDIT: Я заметил, что при использовании длины вашего номера в методе .toPrecision вы всегда будете возвращать исходное значение. Это не так хорошо округлено, но по крайней мере вы не получите никаких ошибок. Если вы хотите настроить это поведение для округлых чисел, я предлагаю использовать поле-заполнитель/атрибут/что-то для хранения значения.

Answer 2

Вам нужно сделать что-то, как показано ниже. при условии, что «выбрать» получил и идентификатор «ddlDuration» с помощью JQuery

$('#ddlDuration').change(function(){ 
    if($(this.val) == 'perhour'{ 
     pharmacist = $('input[name="pharmacist"]'); 
     pharmacist.val(calculateHourlyFromAnnual(pharmacist.val())); 
    } 
}); 

function calculateHourlyFromAnnual(annumRate) 
{ 
    return 100; // calculate the value of the hourly rate based on the per-annum rate 
}