Question

我正在尝试创建一个程序，在给定某些值时为椭圆创建方程式。当我尝试添加两个变量时，整数添加类似字符串。 EX。 -4 + 4应该等于0但它最终等于-44

＆＃13;

var vertexY = 0
var vertex2Y = 0
function solveEllipse(){
    vertexY = document.getElementById("ellipseVertexYInput").value
    vertex2Y = document.getElementById("ellipseVertexY2Input").value
    centerY = (vertexY + vertex2Y)
    console.log(centerY)
}

＆＃13;

<form method="post" class="forms" id="ellipseVertexDiv">
    Vertex
    <br/>
    Y				
    <input type="text" name="vertexY" class="ellipseVariableInput" id="ellipseVertexYInput">
</form>
<form method="post" class="forms" id="ellipseVertex2Div">
    Vertex 2
    <br/>
    Y				
    <input type="text" name="vertexY2" class="ellipseVariableInput" id="ellipseVertexY2Input">
    <input type="button" name="submitButton" value="Submit" class="forms submitButton" id="ellipseSubmit" onclick="solveEllipse()">
</form>

＆＃13;

Answer 1

那是因为它们是弦乐！ value标记的input属性始终为字符串。如果要将值转换为其数字版本，可以使用var numberValue = Number(stringValue)

Answer 2

那是因为输入值被视为字符串，因此你是连接字符串。在进行计算之前，请尝试解析它们。

＆＃13;

function solveEllipse(){
var vertexY = parseInt(document.getElementById("ellipseVertexYInput").value, 10);
var vertex2Y = parseInt(document.getElementById("ellipseVertexY2Input").value, 10);
centerY = (vertexY + vertex2Y)
console.log(centerY)
}

＆＃13;

<form method="post" class="forms" id="ellipseVertexDiv">
Vertex
<br />
Y				
<input type="text" name="vertexY" class="ellipseVariableInput" id="ellipseVertexYInput">
</form>
<form method="post" class="forms" id="ellipseVertex2Div">
Vertex 2
<br/>
Y				
<input type="text" name="vertexY2" class="ellipseVariableInput" id="ellipseVertexY2Input">
<input type="button" name="submitButton" value="Submit" class="forms submitButton" id="ellipseSubmit" onclick="solveEllipse()">
</form>

＆＃13;

Answer 3

因为document.getElementById("ellipseVertexYInput").value返回一个字符串。

您可以使用+将其转换为整数：+vertexY

＆＃13;

var vertexY = 0
var vertex2Y = 0
function solveEllipse(){
    vertexY = document.getElementById("ellipseVertexYInput").value;
    vertex2Y = document.getElementById("ellipseVertexY2Input").value;
    centerY = +vertexY + +vertex2Y;
    console.log(centerY);
}

＆＃13;

<form method="post" class="forms" id="ellipseVertexDiv">
Vertex
<br />
Y				
<input type="text" name="vertexY" class="ellipseVariableInput" id="ellipseVertexYInput">
</form>
<form method="post" class="forms" id="ellipseVertex2Div">
Vertex 2
<br/>
Y				
<input type="text" name="vertexY2" class="ellipseVariableInput" id="ellipseVertexY2Input">
<input type="button" name="submitButton" value="Submit" class="forms submitButton" id="ellipseSubmit" onclick="solveEllipse()">
</form>

＆＃13;

Answer 4

这里发生的是它将它们组合在一起，好像它是文本一样。要获取数字，您必须使用ParseInt(document.getElementById("ellipseVertexYInput").value)。

在这个JSFiddle中，我为您修复了代码;

<form method="post" class="forms" id="ellipseVertexDiv">
  Vertex
  <br /> Y
  <input type="text" name="vertexY" class="ellipseVariableInput" id="ellipseVertexYInput">
</form>
<form method="post" class="forms" id="ellipseVertex2Div">
  Vertex 2
  <br/> Y
  <input type="text" name="vertexY2" class="ellipseVariableInput" id="ellipseVertexY2Input">
  <input type="button" name="submitButton" value="Submit" class="forms submitButton" id="ellipseSubmit" onclick="solveEllipse()">
</form>
<script>
  var vertexY = 0
  var vertex2Y = 0

  function solveEllipse() {
    vertexY = ParseInt(document.getElementById("ellipseVertexYInput").value);
    vertex2Y = ParseInt(document.getElementById("ellipseVertexY2Input").value);
    centerY = (vertexY + vertex2Y);
    console.log(centerY);
  }

</script>

另外，请考虑仅向其添加type="number"来输入您的输入数字。

为什么我的整数添加类似字符串

4 个答案: