Question

我正在制作基本游戏，而且我有一个我正在使用的拼贴系统。每个图块的ID为＆＃34; tileX＆＃34;，其中X是数字（例如tile1）。我的功能如下：

window.onclick = function() {
    var x = event.clientX, y = event.clientY,
    elementMouseIsOver = document.elementFromPoint(x, y).id;
    document.getElementById("tileTell").value = elementMouseIsOver;
    console.log(elementMouseIsOver);
    console.log(typeof(elementMouseIsOver));
    elementMouseIsOver = parseInt(elementMouseIsOver);
    console.log(elementMouseIsOver);
    console.log(typeof(elementMouseIsOver));
}

第4行的代码填写了一个输入字段，这样我就可以直观地看到我点击了哪个瓷砖（我用这个来确保工作正常，所以我可以找到我需要的瓷砖）。这很好。在第5行，当我执行console.log时，它会为我提供正确的ID，并验证它是string。

之后我想将elementMouseIsOver变量重置为整数，因此如果ID为tile1，我希望新结果为1。但是当我在控制台中查看它时，我得到了NaN。然后当我在那之后立即检查它的类型时，我得到number。

parseInt似乎没有正常工作，我做错了什么？我需要使用每个磁贴的ID名称进行数学运算，因此这对我的游戏至关重要。我知道这可能是一个非常愚蠢的错误，但我完全不知所措......

Answer 1

如果您希望parseInt()按照您使用它的方式处理字符串，则必须以数字开头;在你的情况下，它以字母字符开头，因此（隐含的基数为10）它将正确地返回NaN。

您可以使用通用方法获取数字：

var num = +(elementMouseIsOver.match(/\d+/) || [])[0];

它匹配它可以找到的第一组数字，然后使用一元加运算符将其转换为实际数字值。如果字符串不包含任何数字，则会产生NaN。

在您的特定情况下，您还可以在parseInt()后紧跟的部分应用"tile"：

var num = +elementMouseIsOver.substr(4);

Answer 2

NaN是正确的。

https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/parseInt

如果parseInt遇到的字符不是指定基数中的数字，它会忽略它和所有后续字符，并返回解析到该点的整数值。

没有成功解析。

修改

您可以通过从字符串中删除非数字字符来完成您想要的操作，假设您始终使用字符串+整数作为ID。试试这个：

parseInt(elementMouseIsOver.replace(/[^\d]/,""))

Answer 3

NaN的类型是数字。

使用isNaN()来测试值是NaN还是 N a 数字 https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/isNaN

您也可以使用Number()强制转换代替parseInt()。

Answer 4

您需要先删除“tile”字符串，以便正确解析值：

elementMouseIsOver = parseInt(elementMouseIsOver.substring("tile".length));

.substring("tile".length)返回以“tile”后面的字符开头的子字符串（字符串中的位置4，count从0开始），只产生ID的编号（作为字符串）。

小提琴：http://jsfiddle.net/rk96uygd/

Answer 5

您尝试对非数字的元素ID进行parseInt，当解析失败时，它将返回NaN (*or not a number*)

elementMouseIsOver = parseInt(elementMouseIsOver);

此外，您的elementMouseIsOver是ID控件，我认为.value无法获得控制值

elementMouseIsOver = document.elementFromPoint(x, y).id;

Javascript parseInt没有处理字符串，试图从HTML值中获取整数

5 个答案: