计算- Javascript -总面积除以平方英尺和年租金除以平方英尺

Calculations - Javascript - Square feet total divided by square feet and Annual Rent divided by Square Feet

本文关键字：平方英尺 年租金 Javascript 计算 总面积      更新时间：2023-09-26

我试图有几个计算运行。其中之一是年租金除以平方英尺面积。除非您添加逗号或美元符号，否则此操作有效。我还希望租金/平方英尺字段显示什么都没有，而不是Nan，如果没有填写在字段中。第二个字段通过将总平方英尺除以平方英尺给出百分比(% NRA)。如果字段中没有任何内容，我也希望保持空白。任何帮助将非常感激!

 <html>
 <head>
 <title></title>


 <body>
<form method="POST" action>

<table border="0" width="640">
  <tr>
    <td width="169"><font face="Arial" size="2">Total Square Feet:</font></td>
    <td width="136"><font size="2" face="Arial">
    <input type="text" name="SF" id="TotalSF" OnChange="calcNRA1();" size="18" tabindex="530"></font></td>
  </tr>
  </table>
&nbsp;
&nbsp;
<table border="1" height="167">
  <tr>
    <td width="82" align="center" height="16"><font face="Arial" size="2">Sq.
      Ft.</font></td>
    <td width="61" align="center" height="16"><font face="Arial" size="2">%
      NRA:</font></td>
    <td align="center" height="16" style="width: 106px"><font face="Arial" size="2">Annual
      Rent</font></td>
    <td align="center" height="16" style="width: 129px"><font face="Arial" size="2">&nbsp;
      Rent/Sq. Ft.</font></td>
  </tr>
  <tr>
    <td width="82" align="center" style="height: 23px"><font face="Arial" size="2">
    <input type="text" name="SF_Tenant1" id="sqft1" OnFocus="calcRentSQFTOne()" OnKeyUp="calcRentSQFTOne()"  OnChange="calcNRA1()" size="10" tabindex="602" class="style4"></font></td>
    <td width="61" align="center" style="height: 23px"><font face="Arial" size="2">
    <input type="text" name="PercNRA_Tenant1" id="NRA1" size="7" tabindex="603"></font></td>
    <td style="height: 23px; width: 106px;" class="style5"><font face="Arial" size="2">
    <strong><font size="2">$ </font></strong>
    <!--webbot bot="Validation" s-data-type="Number" s-number-separators=",." --><input type="text" name="AnnualRent_Tenant1" id="annualrent1" OnFocus="calcRentSQFTOne()" onblur="this.value = '$' + formatNumber(this.value, 0, 0, true)"  OnKeyUp="calcRentSQFTOne()" size="11" tabindex="604"></font></td>
    <td style="height: 23px; width: 129px;" class="style7"><font face="Arial" size="2">
    <strong><font size="2">$ </font></strong>
    <!--webbot bot="Validation" s-data-type="Number" s-number-separators=",." --><input type="integer" name="RentSF_Tenant1" id="rentsqft1"  OnFocus="calcRentSQFTOne()"   onblur="this.value = '$' + formatNumber(this.value, 0, 0, true)" readonly="readonly" size="11" tabindex="605"></font></td>
  </tr>
  </table>
&nbsp;
<p><font face="Arial" size="2">
 <input type="submit" value="Save" name="Save" tabindex="999" style="font-family: Arial; font-size: 10pt; width: 65px; height: 29px;"></font></p>
 </form>
 <script type="text/javascript">
 function calcRentSQFTOne(){
    SquareFeet1 = document.getElementById("sqft1").value;
    AnnualRent1 = document.getElementById("annualrent1").value;
    document.getElementById("rentsqft1").value = 
                    (AnnualRent1 * 1) 
                                          / (SquareFeet1 * 1);

 }

 //
 function formatNumber(number, digits, decimalPlaces, withCommas)
 {
    number       = number.toString();
var simpleNumber = '';
// Strips out the dollar sign and commas.
for (var i = 0; i < number.length; ++i)
{
    if ("0123456789.".indexOf(number.charAt(i)) >= 0)
        simpleNumber += number.charAt(i);
}
number = parseFloat(simpleNumber);
if (isNaN(number))      number     = 0;
if (withCommas == null) withCommas = false;
if (digits     == 0)    digits     = 1;
var integerPart = (decimalPlaces > 0 ? Math.floor(number) : Math.round(number));
var string      = "";
for (var i = 0; i < digits || integerPart > 0; ++i)
{
    // Insert a comma every three digits.
    if (withCommas && string.match(/^'d'd'd/))
        string = "," + string;
    string      = (integerPart % 10) + string;
    integerPart = Math.floor(integerPart / 10);
}
if (decimalPlaces > 0)
{
    number -= Math.floor(number);
    number *= Math.pow(10, decimalPlaces);
    string += "." + formatNumber(number, decimalPlaces, 0);
 }
 return Math.round(input*100)/100 + "$";
 }


 function calcNRA1(){
    SquareFeet1 = document.getElementById("sqft1").value;
    TSF = document.getElementById("TotalSF").value;
    document.getElementById("NRA1").value = 
                    (SquareFeet1 * 1)/(TSF * 1) * 100
                                            + "%" ;                                
 }

 </script>
 </body>
 </html>

您的脚本有几个问题，如果解决了，可以使您的脚本更容易调试和管理，并使其更少出错。

  1. 您将字符串连接与数值计算混合。相反，将所有值转换为数值，计算，然后连接并格式化。以数字形式存储计算，只有在准备显示时才格式化。

  2. 简化你的函数，这样它只会做一件事:将格式化的"数字"转换为数值或将数值转换为格式化的字符串。重构formatNumber只做一件事，让第二个函数做另一件事(例如formatNumber()→formatNumber()和convertToNumeric())

例子
// convert to numeric type, default to 0 if empty(?)
var SquareFeet1 = convertToNumeric(document.getElementById("sqft1").value);
var TSF = convertToNumeric(document.getElementById("TotalSF").value);
// calculate and store as numeric values
var nra = SquareFeet1 / TSF * 100;
// format and concatenate for display
var nraInput = document.getElementById("NRA1");
if (nra > 0) {
    nraInput.value = formatNumber(nra) + "%" ;
}
else {
    nraInput.value = "";
}
相关文章：