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:
- Change the code to
& lt; Head
- Remove all
windows.
should not -setInterval (instead of
windows.set inner
.- function while setting the function interval function -
setInterval
- Remove all
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