Saturday, 15 August 2015

javascript - ClearInterval() does not work on existing interval -


I wrote the following function for a school project, but clearinterval () is not working is . I have seen many questions about the same problem and it was a problem with most of the time.
However, I think my function uses a global variable, which should work. It's not, and I do not know why. Please highlight me.

HTML (part of the table with exactly the same rows)

  & lt; Tr id = "row35" data-uitval = "1" class = "" & gt; & Lt; TD & gt; & Lt; Button type = "button" id = "knopje" class = "tabeluur" data-viewer = "35" onclic = "check (this)" & gt; & Lt; P & gt; ✕ & lt; / P & gt; & Lt; / Button & gt; & Lt; / TD & gt; & Lt; TD & gt; Other cells ... & lt; / Td> & Lt; / TR & gt;  

Code (javascript, in -tag)

  var fadingFunc; Var busy = false; Function Check (UurID) {if (Busy) {$ ('# Foolmoulding'). Html ('' '' You'll be worried loopt knock. Watch tout day afghelopen '')} FIS {uitval (uurID); }; }; The function fits out uitval (uurID) {// button button (& lt; p & gt;) and is stuck in continuous fading; Func = window.setInterval (fadeBlink (uurID), 2000); $ .post ('AnswerMe.php', {// send stuff}, function (data) {if (data === 'succes: uitval toegevoegd') {window.clearInterval (fadingFunc); // do stuff} and if (Data === 'succes: uitval verwijderd') {window.clearInterval (fadingFunc); // do stuff} Other {window.clearInterval (fadingFunc); // do stuff};}); }; Note 1: I have actually removed some code because it is irrelevant to this question. Note 2: I tested this on my computer (local host, Google Chrome) and has a value in  fadingFunc  global scope (tested in the developers mode through the console) 

So if I got it - you want to snooze the x inside the button, while waiting for the post request response Used to be.

Your code is almost there but you are not using setInterval correctly and you are choosing a poor perspective to achieve it before we fix your code. You will then see your approach using a CSS animation.

To fix your code:

  1. Change the code to & lt; Head
  2. Remove all windows. should not - setInterval (instead of windows.set inner .
  3. function while setting the function interval function - setInterval

Check it out:

The other way that I am able to wrap the target function with (function () {fadeBlink (uurID);}, 2000) It seems that it will be better for you to add a class before the request and it will have to be removed when it is finished.

The second approach:

Second Approach Code:

JS

  var busy = false; function check (uurID) {if (busy) $ ('# foutmelding'). Html ('Uw vorige bewerking loopt nog.'); Else uitval (uurID) ;} Function uitval (uurID) {$ (UurID) .addClass ('blink'); busy = true; $ .post ('http://fiddle.jshell.net/_display/', {test: 'test}} , Function () {$ (uurID) .removeClass ('blink'); busy = false;});}  

CSS

  .blink p {-webkit-animation-name: blinker; -WebKit-Animation-duration: 1s; Webkit-animation-timing function: linear; Webkit-animation-repetition-count: infinity; -moz-animation-name: blinker; -Moose animation duration: 1s; -MOZ-animation-time-work: linear; -moz-animation-repetition-count: infinity; Animation-name: Blinker; Animation Duration: 1s; Animation-timing-function: linear; Animation-repetition-count: infinity; } @ -mose-keyframe blinker {0% {fuzzy: 1.0; } 50% {Opacity: 0.0; } 100% {Opacity: 1.0; }} @ -webkit-keyframe blinker {0% {obscurity: 1.0; } 50% {Opacity: 0.0; } 100% {Opacity: 1.0; }} @Keffreem Blinker {0% {Opacity: 1.0; } 50% {Opacity: 0.0; } 100% {Opacity: 1.0; }}  

No comments:

Post a Comment