JS实现印度卢比金额转文字时用input标签id取值无输出问题

问题原因 #

1. 你的转换逻辑仅在页面DOM加载完成时执行了一次，此时input输入框为空，没有可转换的数值，所以不会输出有效结果；且没有绑定输入事件，后续用户在输入框填写内容时，不会重新触发转换逻辑
2. input的value属性返回的是字符串类型，直接用于数学运算可能出现类型异常，需要先转换为数字类型
3. 没有处理空输入的边界情况，空值会导致运算异常

修复后完整代码 #

JS 部分

// 封装为独立转换函数，支持多次调用
function convertRupeeToWords() {
  // 输入值转数字，空输入默认按0处理
  var amount = Number(document.getElementById('value').value) || 0;
  var fraction = Math.round(frac(amount) * 100);
  var f_text = "";
  if (fraction > 0) {
    f_text = "AND " + convert_number(fraction) + " Paisa";
  }
  var words = convert_number(amount) + " Rupee " + f_text + " Only";
  document.getElementById("word").innerHTML = words;
  return words;
}

function frac(f) {
  return f % 1;
}

function convert_number(number) {
  if ((number < 0) || (number > 999999999)) {
    return "NUMBER OUT OF RANGE!";
  }
  var Gn = Math.floor(number / 10000000); 
  number -= Gn * 10000000; 
  var kn = Math.floor(number / 100000); 
  number -= kn * 100000; 
  var Hn = Math.floor(number / 1000); 
  number -= Hn * 1000; 
  var Dn = Math.floor(number / 100); 
  number = number % 100; 
  var tn = Math.floor(number / 10); 
  var one = Math.floor(number % 10); 
  var res = "";

  if (Gn > 0) {
    res += (convert_number(Gn) + " Crore");
  }
  if (kn > 0) {
    res += (((res == "") ? "" : " ") +
    convert_number(kn) + " Lakh");
  }
  if (Hn > 0) {
    res += (((res == "") ? "" : " ") +
    convert_number(Hn) + " Thousand");
  }
  if (Dn) {
    res += (((res == "") ? "" : " ") +
    convert_number(Dn) + " Hundred");
  }
    
    var ones = Array("", "One", "Two", "Three", "Four", "Five", "Six", "Seven", "Eight", "Nine", "Ten", "Eleven", "Twelve", "Thirteen", "Fourteen", "Fifteen", "Sixteen", "Seventeen", "Eighteen", "Nineteen");
    
    var tens = Array("", "", "Twenty", "Thirty", "Fourty", "Fifty", "Sixty", "Seventy", "Eighty", "Ninety");
    
    if (tn > 0 || one > 0) {
      if (!(res == "")) {
        res += " ";
      }
      if (tn < 2) {
        res += ones[tn * 10 + one];
      }
      else {
        res += tens[tn];
        if (one > 0) {
          res += (" " + ones[one]);
        }
      }
    }
    if (res == "") {
      res = "Zero";
    }
    return res;
}

$(document).ready(function () {
  // 绑定输入事件，输入框内容变化时自动重新转换
  $('#value').on('input', convertRupeeToWords);
  // 页面加载完成时执行一次，显示默认值的转换结果
  convertRupeeToWords();
});

HTML 部分

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="number" id="value" />
<div id="word"></div>

内容的提问来源于stack exchange，提问作者Cross