<!doctype html>
<head>
<script type="text/javascript">
window.onload = function ()
{
var $ = function (id)
{
return document.getElementById(id)
}
var minimum_count = 500
var count_element = $("count")
var price_element = $("price")
var default_count = count_element.getAttribute("value")
var default_price = price_element.getAttribute("value")
var count_from_price = function (price)
{
return Math.floor(price * default_count / default_price)
}
var price_from_count = function (count)
{
return Math.round(count * default_price / default_count * 100) / 100;
}
var minimum_count_validate = function (count)
{
return count >= minimum_count
}
var minimum_count_fix = function ()
{
count_element.value = minimum_count
change_price()
}
var change_price = function ()
{
var count = count_element.value
var price = price_from_count(count)
minimum_count_validate(count) ? price_element.value = price : minimum_count_fix()
}
var change_count = function ()
{
var price = price_element.value
var count = count_from_price(price)
minimum_count_validate(count) ? count_element.value = count : minimum_count_fix()
}
count_element.onblur = price_element.onfocus = change_price
price_element.onblur = count_element.onfocus = change_count
}
</script>
</head>
<body>
<form>
c: <input type="text" id="count" value="1000" /> <br />
p: <input type="text" id="price" value="1" />
</form>
</body>