parseFloat 在应该是 -0.1 或 0.1 时不断返回 NaN

parseFloat keeps returning NaN when it should be -0.1 or 0.1

本文关键字:返回 NaN parseFloat      更新时间:2023-09-26

parseFloat 在控制台中打印时应该为 -0.1 或 0.1 时不断返回 NaN.log,我很可能只是累了,但我看不到问题。一如既往地非常感谢任何帮助,这里也不是找jQuery的答案,这一定是JS的

function startUp() {
    var fontButtons = document.getElementsByClassName("fontsizer");
    for (var i=0; i < fontButtons.length; i++) {
    document.getElementsByClassName("fontsizer")[i].addEventListener("click", resizeText);
    }
};
window.onload = startUp;
function resizeText() {
    var fontChange = parseFloat(this.value);
    console.log(fontChange);
    if (document.body.style = "") {
        document.body.setAttribute("style", "font-size:1.0em;");
    }
    var currentFontSize = parseFloat(document.body.style.fontSize.replace('em', ''));
    console.log(currentFontSize);
    document.body.style.fontSize = (currentFontSize + fontChange) + "em";
};

和 HTML

<div id="fontbuttons">
 <input class="fontsizer" value="-0.1" type="image" id="fontdown" alt="-" src="fontdown.png" />
 <input class="fontsizer" value="0.1" type="image" id="fontup" alt="+" src="fontup.png" />
</div>

你有几个问题。

首先,将属性设置为 onclick 并将回调作为字符串传入将使用 eval 来调用函数,this将指向全局对象,因此请改用 addEventListener('click', resizeText)


其次,你不能用这样的字母parseFloat数字 - 在解析之前去掉em

var currentFontSize = parseFloat(document.body.style.fontSize.replace('em', ''));

第三,您正在连接而不是添加。改变

document.body.style.fontSize = currentFontSize + fontChange + "em"

document.body.style.fontSize = (currentFontSize + fontChange) + "em"

工作演示 : http://jsfiddle.net/8tv550us/

我相信 resizeText() 函数中的 this.value 是你的错误所在。 你认为这里的"这个"指的是什么?我认为它目前将是窗口对象。

添加事件侦听器而不是设置属性,this将指向正确的对象

document.getElementsByClassName("fontsizer")[i].addEventListener("click", resizeText);