这个问题让我疯了。我因此而至少失去了一个星期而且我不知道是什么造成了它。我上周开始使用jQuery Number Format,但发现我想要做的事情非常多 - 基本上,用户在一个框中输入一个数字,另外两个框根据输入而改变。然后我开始查看toFixed()
并设法将某些东西放在一起。但是,我无法用数千个逗号分隔符来格式化数字。然后我今天花了一整天时间toLocale()
,然后是this stackoverflow问题的答案,最后是accounting.js,但我有完全相同的问题。我现在认为NumberFormat根本没有错误,而且我的代码导致了这个问题。有人可以帮忙吗?
错误如下: -
我在“周刊”中输入一个数字'文本框(id="weekly_credit"
)和我的javascript将其转换为每月一次'和'年度'相当于并将其输出到另外两个文本框中(id="monthly_credit"
& id="tax_credit"
)
当我点击每月或每年的文本框然后再次点击退出时,这些数字会自行更改 - 它通常会在最后修复数千个。
我已经链接到以下两个视频。一个显示它工作正常,但没有逗号格式的数字。第二个显示错误。我不能为我的生活弄清楚我做错了什么。我对rails很有用,并且没有使用过很多javascript或者jQuery但是知道得足够多。谢谢阅读。如有必要,我可以发布更多代码。
1。工作代码但没有逗号格式的数字
这里有一个简短的video,因为它应该如此,但没有逗号格式的数字。下面是实现它的代码提取:
视图/雇员/ _form.html.erb
<script>
// Highlight the text when the user clicks on a textbox
var getFocus = function(){
$(this).select();
};
// Function to re-calculate weekly/monthly/annual when move away from the text input
var loseFocus = function(){
var amount = parseFloat(this.value).toFixed(2);
if (($(this).is('#weekly_credit'))||($(this).is('#weekly_cutoff'))){
var monthly = calculateEquivalent(amount, "weekly", "monthly").toFixed(2);
var annual = calculateEquivalent(amount, "weekly", "annual").toFixed(2);
if ($(this).is('#weekly_credit')){
$("#monthly_credit").val(monthly);
$("#tax_credit").val(annual);
}
else{
$("#monthly_cutoff").val(monthly);
$("#tax_cutoff").val(annual);
}
}
else if (($(this).is('#monthly_credit'))||($(this).is('#monthly_cutoff'))){
var weekly = calculateEquivalent(amount, "monthly", "weekly").toFixed(2);
var annual = calculateEquivalent(amount, "monthly", "annual").toFixed(2);
if ($(this).is('#monthly_credit')){
$("#weekly_credit").val(weekly);
$("#tax_credit").val(annual);
}
else{
$("#weekly_cutoff").val(weekly);
$("#tax_cutoff").val(annual);
}
}
else if (($(this).is('#tax_credit'))||($(this).is('#tax_cutoff'))){
var weekly = calculateEquivalent(amount, "annual", "weekly").toFixed(2);
var monthly = calculateEquivalent(amount, "annual", "monthly").toFixed(2);
if ($(this).is('#tax_credit')){
$("#weekly_credit").val(weekly);
$("#monthly_credit").val(monthly);
}
else{
$("#weekly_cutoff").val(weekly);
$("#monthly_cutoff").val(monthly);
}
}
else{
document.write("Something is very wrong");
}
// alert("The value of amount is: " + amount);
$(this).val(amount);
};
// Everything inside this function gets called on the page load
$(function() {
// Implement the jQuery UI tab structure for employee form
$( "#tabs-1" ).tabs({
active:1});
// Bind getFocus function to textbox focus
$("#weekly_credit, #monthly_credit, #tax_credit, #weekly_cutoff, #monthly_cutoff, #tax_cutoff").focus(getFocus);
// Bind loseFocus function to textbox blur
$("#weekly_credit, #monthly_credit, #tax_credit, #weekly_cutoff, #monthly_cutoff, #tax_cutoff").blur(loseFocus);
});
</script>
<div class="col-md-5">
<div class="form_label"><strong>Tax Credit</strong></div>
<div class="form_spacer"></div>
<input type="text" id="weekly_credit" value=<%= number_to_currency("#{@weekly_credit}") %>>
<div class="form_spacer"></div>
<input type="text" id="monthly_credit" value=<%= number_to_currency("#{@monthly_credit}") %>>
<div class="form_spacer"></div>
<%= f.text_field :tax_credit, id: "tax_credit", value: number_to_currency(f.object.tax_credit) %>
</div>
2。错误正在发生
通过观看这段简短的video来查看错误最容易。下面的代码与上面的代码几乎相同,只是在更改其他文本框的值时我添加了accounting.formatNumber()
。
views / employees / _form.html.erb(extract)
<script>
// Highlight the text when the user clicks on a textbox
var getFocus = function(){
$(this).select();
};
// Function to re-calculate weekly/monthly/annual when move away from the text input
var loseFocus = function(){
var amount = parseFloat(this.value).toFixed(2);
if (($(this).is('#weekly_credit'))||($(this).is('#weekly_cutoff'))){
var monthly = calculateEquivalent(amount, "weekly", "monthly").toFixed(2);
var annual = calculateEquivalent(amount, "weekly", "annual").toFixed(2);
if ($(this).is('#weekly_credit')){
$("#monthly_credit").val(accounting.formatNumber(monthly, 2));
$("#tax_credit").val(accounting.formatNumber(annual, 2));
}
else{
$("#monthly_cutoff").val(accounting.formatNumber(monthly, 2));
$("#tax_cutoff").val(accounting.formatNumber(annual, 2));
}
}
else if (($(this).is('#monthly_credit'))||($(this).is('#monthly_cutoff'))){
var weekly = calculateEquivalent(amount, "monthly", "weekly").toFixed(2);
var annual = calculateEquivalent(amount, "monthly", "annual").toFixed(2);
if ($(this).is('#monthly_credit')){
$("#weekly_credit").val(accounting.formatNumber(weekly, 2));
$("#tax_credit").val(accounting.formatNumber(annual, 2));
}
else{
$("#weekly_cutoff").val(accounting.formatNumber(weekly, 2));
$("#tax_cutoff").val(accounting.formatNumber(annual, 2));
}
}
else if (($(this).is('#tax_credit'))||($(this).is('#tax_cutoff'))){
var weekly = calculateEquivalent(amount, "annual", "weekly").toFixed(2);
var monthly = calculateEquivalent(amount, "annual", "monthly").toFixed(2);
if ($(this).is('#tax_credit')){
$("#weekly_credit").val(accounting.formatNumber(weekly, 2));
$("#monthly_credit").val(accounting.formatNumber(monthly, 2));
}
else{
$("#weekly_cutoff").val(accounting.formatNumber(weekly, 2));
$("#monthly_cutoff").val(accounting.formatNumber(monthly, 2));
}
}
else{
document.write("Something is very wrong");
}
// alert("The value of amount is: " + amount);
$(this).val(amount);
};
// Everything inside this function gets called on the page load
$(function() {
// Implement the jQuery UI tab structure for employee form
$( "#tabs-1" ).tabs({
active:1});
// Bind getFocus function to textbox focus
$("#weekly_credit, #monthly_credit, #tax_credit, #weekly_cutoff, #monthly_cutoff, #tax_cutoff").focus(getFocus);
// Bind loseFocus function to textbox blur
$("#weekly_credit, #monthly_credit, #tax_credit, #weekly_cutoff, #monthly_cutoff, #tax_cutoff").blur(loseFocus);
});
</script>
<div class="col-md-5">
<div class="form_label"><strong>Tax Credit</strong></div>
<div class="form_spacer"></div>
<input type="text" id="weekly_credit" value=<%= number_to_currency("#{@weekly_credit}") %>>
<div class="form_spacer"></div>
<input type="text" id="monthly_credit" value=<%= number_to_currency("#{@monthly_credit}") %>>
<div class="form_spacer"></div>
<%= f.text_field :tax_credit, id: "tax_credit", value: number_to_currency(f.object.tax_credit) %>
</div>