Javascript数字格式不断改变我的数字

时间:2015-02-01 01:02:21

标签: javascript jquery ruby-on-rails

这个问题让我疯了。我因此而至少失去了一个星期而且我不知道是什么造成了它。我上周开始使用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>

0 个答案:

没有答案