Question

我创建了一个按钮来添加一个吻计数器，但我得到一个NaN值，我不知道如何解决它。你能帮帮我吗？

我将值保存在LocalStorage中，并且我使用jQuery获取DOM的值。这就是我正在做的保存数据：

<h1>Due: <span id="counter">0</span></h1>
<a id="btn" href="javascript:void(0);">+</a>

var btn = $('#btn').click(function() {
        var valor = $('#counter');        
        valor.text(parseInt(valor) + 1);
        saveData();
    });

function saveData() {
    if (supportsLocalStorage()) {
        var counter = $('#counter').text();
        localStorage.setItem('kisses', counter);
    }
}

每次单击加号按钮时，我都会收到NaN值。

我有一个小提琴。

https://jsfiddle.net/usdjsr40/

希望你们能解决我的问题，谢谢。

Answer 1

您正在尝试解析一个对象，因此 NaN 和 NaN + 1会提供 NaN 。所以试试这个：

var btn = $('#btn').click(function() {
        var valor = $('#counter');        
        valor.text(parseInt(valor.html().trim()) + 1);
        saveData();
    });

function saveData() {
    if (supportsLocalStorage()) {
        var counter = $('#counter').text();
        localStorage.setItem('kisses', counter);
    }
}

Answer 2

您正在将一个html对象传递给parseInt，因此它正在发送NaN。

 var valor = $('#counter');

这里的valor是html元素而不是字符串。

试试这个： -

 var valor = $('#counter').text().trim();

Answer 3

NaN表示不是数字。您没有正确加载$('#counter')的数据。

$('#counter')只是jQuery元素对象。您正在尝试将第一个添加到JavaScript对象，而不是数字。

为了获取元素中的值，您需要像这样调用它：

$('#counter').html()

然后你可以将parseInt包装在它周围：

parseInt( $('#counter').html() )

所以你的前几行代码应该是这样的：

<h1>Due: <span id="counter">0</span></h1>
<a id="btn" href="javascript:void(0);">+</a>

var btn = $('#btn').click(function() {
        var valor = $('#counter').html();     
        valor.text(parseInt(valor) + 1);
        saveData();
    });

每次我在Javascript中加一个数字时，我都有一个NaN值

3 个答案: