中断setInterval和变量未定义

Question

I'm new to Javascript and tried doing this script. Onclick it should grab the price of the item and stop the price dropping. Onclick, it doesn't stop and it doesn't grab the price shown. Please advise.

The price should be:-

Start Price: 100 Lowest Max Price: 90

 function updateValue(task) { var amount = document.getElementById("amount").value + "00"; var maxamt = document.getElementById("maxamount").value + "00"; var amountgrabbed = document.getElementById("revese-amt").value; var decimal_places = 2; var decimal_factor = decimal_places === 0 ? 1 : Math.pow(10, decimal_places); var floored_number = Math.floor(amount) / decimal_factor; var floored_number_max = Math.floor(maxamt) / decimal_factor; floored_number = floored_number.toFixed(decimal_places); floored_number_max = floored_number_max.toFixed(decimal_places); if (task == "stop") { console.log(amountgrabbed); check(refreshid, "stop", amountgrabbed); } else { var refreshid = setInterval(function() { floored_number = floored_number - 1 / 100; floored_number = floored_number.toFixed(decimal_places); if (floored_number < floored_number_max) { check(refreshid, "over"); } else { $('#revese-amt').html(floored_number); } }, 100); } } function check(refreshid, status, amt) { if (status == "over") { clearInterval(refreshid); $('#revese-amt').html('Deal Gone!'); } else if (status == "stop") { console.log(amt); clearInterval(refreshid); alert('Congratulations! You have grabbed the item @ price of RM ' + amt); } } 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <input type="text" name="amount" id="amount" value="Start Price" onclick=""/> <BR> <BR> <input type="text" name="maxamount" id="maxamount" value="Lowest Max Price" onblur="updateValue()" /> <span id="maxa"></span> <BR> <BR> <div style="width:130px; height:50px; background-color:red;" onclick="updateValue('stop')"> <center>MYR <p id="revese-amt"></p> </center> </div> 

Answer 1

You can change your code about below:

first html p tag ,must use textContent method to get its text.

// change
var amountgrabbed = document.getElementById("revese-amt").value;

// to
var amountgrabbed = document.getElementById("revese-amt").textContent;

Answer 2

Change

 var amountgrabbed = document.getElementById("revese-amt").value;

To

 var amountgrabbed = $('#revese-amt').html();

So that is matches your assignment of

 $('#revese-amt').html(floored_number);

And then declare your var refreshid variable in the global space. Giving it access everywhere.

  $refreshid = setInterval(function() {
  floored_number = floored_number - 1 / 100;
  floored_number = floored_number.toFixed(decimal_places);
  if (floored_number < floored_number_max) {
    check(refreshid, "over");
  } else {
    $('#revese-amt').html(floored_number);
  }

}, 100);