关于输入字段添加的javascript答案

【问题标题】：javascript on input field addition关于输入字段添加的javascript
【发布时间】：2016-07-21 07:32:29
【问题描述】：

//// JavaScript function to add input values display into another input field 
function calculate() {
  var x = document.getElementById('fee_selector_holder').value;
  var y = document.getElementById('content').value;
  var result = document.getElementById('result');
  var myResult = x + y;
  result.value = myResult;

}

<input type="text" name="hostelfees" id="content" oninput="calculate()">

<input type="text" name="fee_id" id="fee_selector_holder" oninput="calculate()">

<input type="text" id="result" name="totalfee">

我正在为输入字段提供值，它添加连接但未添加，请在输入功能上验证它是正确还是错误，一旦验证然后回复我，这就是我的问题。

【问题讨论】：

值不是用加法符号添加的，而是它与乘法和减法除法一起使用

标签： javascript html

【解决方案1】：

你有字符串，这就是它连接的原因。用以下方法制作整数： http://www.w3schools.com/jsref/jsref_parseint.asp

而且效果会很好。

【讨论】：

我还想检查单选按钮动态更改输入值，然后将该值添加到另一个输入字段

【解决方案2】：

首先，当您从 DOM 读取值时，它们被读取为字符串。您必须使用parseInt 或parseFloat 将字符串转换为整数。

第二，+ 运算符具有覆盖字符串的功能，可以作为连接运算符。

另外请注意，我使用了.value || 0。这里如果值不存在，对其进行算术运算将返回NaN，因此添加默认值（0）。

//// JavaScript function to add input values display into another input field 
function calculate() {
  var x = document.getElementById('fee_selector_holder').value || 0;
  var y = document.getElementById('content').value || 0;
  var result = document.getElementById('result');
  var myResult = parseInt(x) + parseInt(y);
  result.value = myResult;

}

<input type="text" name="hostelfees" id="content" oninput="calculate()">

<input type="text" name="fee_id" id="fee_selector_holder" oninput="calculate()">

<input type="text" id="result" name="totalfee">

【讨论】：

【解决方案3】：

您必须将输入值解析为整数，因为默认情况下所有输入值都是字符串：

//// JavaScript function to add input values display into another input field 
function calculate() {
  var x = document.getElementById('fee_selector_holder').value || 0; // default value 0 if input is blank
  var y = document.getElementById('content').value || 0; // default value 0 if input is blank
  var result = document.getElementById('result');
  var myResult = parseInt(x, 10) + parseInt(y, 10); // parse it here 
  result.value = myResult;

}

<input type="text" name="hostelfees" id="content" oninput="calculate()">

<input type="text" name="fee_id" id="fee_selector_holder" oninput="calculate()">

<input type="text" id="result" name="totalfee">

【讨论】：

【解决方案4】：

你应该给result添加属性

result.setAttribute("value", myResult);

【讨论】：