为什么我的JS函数不能正常工作？
[英]Why won't my JS function work properly?
问题描述
I am very new to Javascript, so please pardon my lack of knowledge. 
我是Java的新手，请原谅我缺乏的知识。 I am trying to use Javascript to find the slope of two data points (x1,y1)(x2,y2). 我正在尝试使用Javascript查找两个数据点（x1，y1）（x2，y2）的斜率。 The equation for the slope is m=y1-y2/x2-x1. 斜率的公式为m = y1-y2 / x2-x1。 Here is what I have done so far in JS fiddle: http://jsfiddle.net/1wvfz0ku/ The problem is that when I try to calculate the points only NaN appears. 到目前为止，这是我在JS小提琴中所做的事情： http : //jsfiddle.net/1wvfz0ku/问题是，当我尝试计算点时，仅出现NaN。 Like I said I am very new at coding in JS, so I can't see where I have messed up in. Any help would be much appreciated! 就像我说的那样，我在JS编码方面还很陌生，所以我看不到我陷入了什么困境。任何帮助将不胜感激！ :-) :-)
<!DOCTYPE html>
<html>
<body>
<div style="width:250px;height:auto;margin:auto;">
<h1>Find the Slope of Two Data Points</h1>
<p>
Find the slope of two sets of points:
</p>
<var>M</var>=<p id="slope"></p>
Enter your points below:
<form id="points">
X<sub>1</sub>: <input type="text" id="x1"/><br/>
X<sub>2</sub>: <input type="text" id="x2"/><br/>
Y<sub>1</sub>: <input type="text" id="y1"/><br/>
Y<sub>2</sub>: <input type="text" id="y2"/><br/>
</form>
<script>
function findSlope() {
//The points//
var xOne = document.getElementById("x1").value;
var xTwo = document.getElementById("x2").value;
var yOne = document.getElementById("y1").value;
var yTwo = document.getElementById("y2").value;
//slope equation//
var op1 = yTwo - yOne;
var op2 = xTwo - xOne;
var answer = op1 / op2;
document.getElementById("slope").innerHTML = answer;
}
function reset(){
document.getElementById("points","slope").reset();
}
</script>
<button type="submit" onClick="findSlope()">Find the Slope</button>
<button type="submit" onClick="reset()">Clear Points</button>
</div>
</body>
</html>
2 个解决方案
解决方案1
1 2015-02-06 22:36:21
This works just fine unless xTwo - xTwo is 0 , in which case you're trying to divide a number by 0 , which is defined in JavaScript to be NaN . 这工作得很好 ，除非 xTwo - xTwo为0 ，在这种情况下，你试图通过划分若干0 ，这是在JavaScript中定义为NaN 。
That said: The value property of elements is always a string. 也就是说：元素的value属性始终是一个字符串。 It just happens that all of the operations you've used ( - , / ) will implicitly convert from string to number, but if you'd used + you'd've gotten some very odd results indeed (because + with strings is concatenation, not addition). 碰巧您使用过的所有操作（ - ， / ）都会从字符串隐式转换为数字，但是如果您使用+确实会得到一些非常奇怪的结果（因为+与字符串是串联的） ，而不是加法）。 Better to explicitly ensure you're dealing with numbers, by using parseInt(theString, 10) (if you're dealing with decimal). 最好通过使用parseInt(theString, 10)来明确地确保您正在处理数字（如果您正在处理小数）。
Example allowing for xTwo - xOne being 0 and parsing the inputs as decimal: 允许xTwo - xOne示例xTwo - xOne为0并将输入解析为十进制：
function findSlope() { //The points// var xOne = parseInt(document.getElementById("x1").value, 10); var xTwo = parseInt(document.getElementById("x2").value, 10); var yOne = parseInt(document.getElementById("y1").value, 10); var yTwo = parseInt(document.getElementById("y2").value, 10); //slope equation// var op1 = yTwo - yOne; var op2 = xTwo - xOne; var answer = op2 === 0 ? "flat or whatever" : op1 / op2; document.getElementById("slope").innerHTML = answer; } function reset(){ document.getElementById("points","slope").reset(); }
<div style="width:250px;height:auto;margin:auto;"> <h1>Find the Slope of Two Data Points</h1> <p> Find the slope of two sets of points: </p> <var>M</var>=<p id="slope"></p> Enter your points below: <form id="points"> X<sub>1</sub>: <input type="text" id="x1"/><br/> X<sub>2</sub>: <input type="text" id="x2"/><br/> Y<sub>1</sub>: <input type="text" id="y1"/><br/> Y<sub>2</sub>: <input type="text" id="y2"/><br/> </form> <button type="submit" onClick="findSlope()">Find the Slope</button> <button type="submit" onClick="reset()">Clear Points</button>
解决方案2
-1 2015-02-06 22:36:51
http://www.w3schools.com/jsref/jsref_number.asp使用代码x = Number（x）并对所有变量进行操作
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.