我已经建立了这个简单的租金负担能力的java脚本计算器,我所拥有的问题是" Rent Affordability TextBox"在你使用出现在文本框中的小滚动条然后它会格式化之前,我没有正确格式化美国货币格式,我似乎正在对我发生的onclick事件进行某种排序。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
</head>
<body>
<style>
<!--
.currency {
padding-left:12px;
}
.currency-symbol {
position:absolute;
padding: 2px 5px;
}
//-->
</style>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
function run(){
var PercentageRate = 40;
var Income = parseInt(document.getElementById('YearlyIncome').value);
var Expenses = parseInt(document.getElementById('MonthlyExpenses').value);
var PercentageCalculated = Income / PercentageRate;
document.getElementById('RentAffordability').value = PercentageCalculated - Expenses;
}
</script>
<script>
(function($) {
$.fn.currencyInput = function() {
this.each(function() {
var wrapper = $("<div class='currency-input' />");
$(this).wrap(wrapper);
$(this).change(function() {
var min = parseFloat($(this).attr("min"));
var max = parseFloat($(this).attr("max"));
var value = this.valueAsNumber;
if(value < min)
value = min;
else if(value > max)
value = max;
$(this).val(value.toFixed(2));
});
});
};
})(jQuery);
$(document).ready(function() {
$('input.currency').currencyInput();
});
</script>
<p>Total Yearly Income: <input type="number" class="currency" name="YearlyIncome" id="YearlyIncome" /></p>
<p>Monthly Expenses: <input type="number" class="currency" name="MonthlyExpenses" id="MonthlyExpenses" /></p>
<p>Rent Affordability: <input type="number" class="currency" name="RentAffordability" id="RentAffordability" /></p>
<button onclick="run()">calculate</button>
</body>
</html>
答案 0 :(得分:0)
您只将toFixed
应用于初始化阶段,您需要在计算数字后应用此项。
$('#RentAffordability').val((PercentageCalculated - Expenses).toFixed(2));
您可能还希望在应用toFixed
之前添加其他条件阶段,例如
var min = parseFloat($(this).attr("min"));
var max = parseFloat($(this).attr("max"));
var value = this.valueAsNumber;
if(value < min)
value = min;
else if(value > max)
value = max;
<style>
<!--
.currency {
padding-left:12px;
}
.currency-symbol {
position:absolute;
padding: 2px 5px;
}
//-->
</style>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
function run(){
var PercentageRate = 40;
var Income = parseInt(document.getElementById('YearlyIncome').value);
var Expenses = parseInt(document.getElementById('MonthlyExpenses').value);
var PercentageCalculated = Income / PercentageRate;
//document.getElementById('RentAffordability').value = PercentageCalculated - Expenses;
$('#RentAffordability').val((PercentageCalculated - Expenses).toFixed(2));
}
</script>
<script>
(function($) {
$.fn.currencyInput = function() {
this.each(function() {
var wrapper = $("<div class='currency-input' />");
$(this).wrap(wrapper);
$(this).change(function() {
var min = parseFloat($(this).attr("min"));
var max = parseFloat($(this).attr("max"));
var value = this.valueAsNumber;
if(value < min)
value = min;
else if(value > max)
value = max;
$(this).val(value.toFixed(2));
});
});
};
})(jQuery);
$(document).ready(function() {
$('input.currency').currencyInput();
});
</script>
<p>Total Yearly Income: <input type="number" class="currency" name="YearlyIncome" id="YearlyIncome" /></p>
<p>Monthly Expenses: <input type="number" class="currency" name="MonthlyExpenses" id="MonthlyExpenses" /></p>
<p>Rent Affordability: <input type="number" class="currency" name="RentAffordability" id="RentAffordability" /></p>
<button onclick="run()">calculate</button>