3

I'm trying to get a delay in a jQuery sequence but is refuses to work.

var old = $('.likes' + id).text();
$('.likes' + id).text("You've already voted").delay(3000).text(old); 

Now, the old text gets entered right away with out the 'you've already voted' ever being displayed.

Any suggestions?

EDIT:

As requested:

HTML:

<li>
                            <h2><a href="?page=dub&id=%%DUB_ID%%">%%DUB_TITLE%%</a></h2>
                            <div class="dub">
                                <iframe width="560" height="315" src="http://www.youtube.com/embed/%%YOUTUBE_ID%%?hd=1" frameborder="0" allowfullscreen></iframe>
                                <div id="conten_wrapper">

                                    <div id="conten_meta">
                                        <p> Posted by: <a href="?page=profile&id=%%USER_ID%%">%%USERNAME%%</a><br />
                                            Likes: <span class="likes%%DUB_ID%%">%%LIKES%%</span><br />
                                            Date posted: %%DATE%%
                                        </p>
                                    </div>

                                    <div id="conten_social">
                                        <a href="javascript:void(0);" onclick="javascript:makeRequest(\'like\', %%DUB_ID%%)" class="likebtn">Like</a><a href="javascript:void(0);" onclick="javascript:makeRequest(\'dislike\', %%DUB_ID%%)" class="likebtn2">Dislike</a>
                                    </div>

                                </div>
                            </div>
                        </li>

js:

function makeRequest(name, id){
                $.ajax({
                   type: "GET",
                   url: "ajax.php",
                   data: "name=" + name + "&id=" + id,
                   success: function(msg){
                     var obj = jQuery.parseJSON(msg);
                     if(obj.status == "SUCCES"){
                        $('.likes' + id).html(parseInt($('.likes' + id).html(), 10)+1);
                     }else {
                        var old = $('.likes' + id).text();
                        $('.likes' + id).text("You've already voted").delay(3000).text(old);        
                     }
                   }
                 });
            }
3
  • Care to share your HTML? Dec 2, 2012 at 16:57
  • delay() only works with jQuery's FX queue, which in other words means it only works on jQuery animations. To delay text insertion you'll have to use a timeout, like this -> FIDDLE ... On the other hand, you're doing it wrong, as the success callback will only fire if the ajax call is successful (suprise), and you probably need to use the error (fail) callback and not an if statement inside the success callback.
    – adeneo
    Dec 2, 2012 at 17:10
  • Something like this -> FIDDLE seems more appropriate.
    – adeneo
    Dec 2, 2012 at 17:16

2 Answers 2

4

delay affects only jQuery's "queued effects" like slideUp and fadeIn, for other things you should use JavaScript's native setTimeout.

1
  • and how might i do this? tried this: $('.likes' + id).text("You've already voted").setTimeout(function() { $('.likes' + id).text(old) }, 3000);
    – Roeliee
    Dec 2, 2012 at 17:06
1

An example of doing this with setTimeout: http://jsfiddle.net/ShYVR/

var vote = $('.likes' + id)
var text = vote.text();
setTimeout(function() { vote.text(text); }, 3000);
vote.text("You've already voted");​
0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.