CODEWITHSUNDEEP
javascriptjqueryhtml
dragon
dragon

Reputation: 1264

Get a number like string, convert it and add one every second

I had this question on an interview and I failed. I was close with my answer but I didn't finish the script. The question was: get the text from the paragraph, add one and put back into paragraph every second the new value. My logic was that in the p the number is a string. I convert it in number with parseInt, then check if is notNaN, alert not a number, else increase the value with one and put it back into the p.

Anyone please tell me where I was wrong.

JS:

$(function() {
    setInterval("addOne()", 1000);
});

function addOne() {
    var divP = $("div p").text();
    parseInt(divP);
    if (isNaN(divP)) {
        alert("Not a number!");
    } else {
        divP++;
        $("div p").text();
    }
}

HTML:

<div>
    <p>1</p>
</div>

Upvotes: 1

Views: 86

Answers (4)

KPrasad
KPrasad

Reputation: 1

You can find the answer here.
HTML

 <div>
 <button id="btnClickStart" >
 Start Increment
 </button>
 <button id="btnClickStop">
 Stop Increment
 </button>
 <p id="pId">
 I am testing this script if it will work the 1st time.
 </p>

</div>


JAVASCRIPT

$('#btnClickStart').click(function() {
startIncrement();
});
$('#btnClickStop').click(function() {
stopIncrement();
});
var myInterval ;
function startIncrement(){
myInterval = setInterval(function(){ addOne(); }, 1000);
}

function stopIncrement() {
clearInterval(myInterval);
}

var _array = [];
function addOne() {
var divP = document.getElementById('pId').innerHTML;
var _array = [];
for (var i = 0, len = divP.length; i < len; i++) {
    parseInt(divP[i]);
  if (isNaN(divP[i])) {
    //alert("Not a number!");
       } else{
            _array.push(divP[i]);
    }
 }

  for (var j = 0, len = _array.length; j < len; j++) {
    _str =parseInt( _array[j]);
    if(!isNaN(_str) ){
      divPLast= divP.replace(_str, parseInt(_str)+1);
     }
   }
    document.getElementById('pId').innerHTML = divPLast; 
 }

Upvotes: 0

Hassan Tariq
Hassan Tariq

Reputation: 740

You can use this 

    $("div p").html();

instead of

    $("div p").text();

Sorry, it must be html instead of val because val is for input elements. Thank You

Upvotes: 1

Rory McCrossan
Rory McCrossan

Reputation: 337580

You have quite a few issues:

  • You don't assign the result of parseInt() to anything
  • You aren't providing the radix parameter to parseInt()
  • You should provide the reference of the addOne() function to setInterval() to avoid the intrinsic use of eval()
  • You're using the getter of text(), not setting the value of divP

Here's a working example:

$(function() {
    setInterval(addOne, 1000);
});

function addOne() {
    var divP = parseInt($("div p").text(), 10);
    if (isNaN(divP)) {
        alert("Not a number!");
    } else {
        $("div p").text(++divP);
    }
}

Example fiddle

It could also be argued that calling an alert() to show UI state information (especially in a function called every second) is not good practice.

Upvotes: 5

Robin Carlo Catacutan
Robin Carlo Catacutan

Reputation: 13679

There are 3 errors I can find.

  1. You didn't assign the parseInt(divP) to anything.

    Should be: divP = parseInt(divP);

  2. You are not using the setInterval properly.

    Should be: setInterval(function(){ addOne(); }, 1000);

  3. You didn't put the new value to the element $("div p").text();.

    Should be: $("div p").text(divP);

Do something like this:

$(function() {
    setInterval(function(){ addOne(); }, 1000);
});

function addOne() {
    var divP = $("div p").text();
    divP = parseInt(divP);
    if (isNaN(divP)) {
        alert("Not a number!");
    } else {
        divP++;
        $("div p").text(divP);
    }
}

Fiddle

Upvotes: 1

Related Questions