javascript函数在ajax调用后停止

Question

Good Afternoon,

I have got two functions, one in ajax another one in js as below:

<script>
    /* AJAX request to checker */
    function check(){
        $.ajax({
            type: 'POST',
            url: 'checker.php',
            dataType: 'json',
            data: {
                counter:$('#message-list1').data('counter')
            }
        }).done(function( response ) {
            /* update counter */
            $('#message-list1').data('counter',response.current);
            /* check if with response we got a new update */
            if(response.update==true){
                $('#message-list1').html(response.news);
                var audio = new Audio('ding.mp3');
            audio.play();
            }
        });

    }

    //Every 20 sec check if there is new update
    setInterval(check,2000);
</script>
<script>
    function reblink() {
        $.getScript($('script:first',data).attr('src'), function(){
           eval(blink('.blink'););
        });
</script>

now reblink function stops right after I call ajax function. Again it does starts when I physically refresh page. What I want to achieve is to start this function after my each call of the ajax function.

I was trying to merging them 2 functions by placing:

$.getScript($('script:first',data).attr('src'), function(){
    eval(blink('.blink'););

In if(response.update==true){ } however it does than stop ajax from functioning.

Any suggestions much appreciated.

UPDATE So after changes mentioned in comments code is now looking like below:

                <script>
    /* AJAX request to checker */
    function check4(){
        $.ajax({
            type: 'POST',
            url: 'checker.php',
            dataType: 'json',
            data: {
                counter:$('#last-orders').data('counter')
            }
        }).done(function( response ) {   /* update counter */
        $('#last-orders').data('counter',response.current);
        /* check if with response we got a new update */
        if(response.update==true){
            $('#last-orders').html(response.news4);
            var audio = new Audio('ding.mp3');
        audio.play();
        reblink() // call reblink here to execute
        }
    });
    }
    //Every 20 sec check if there is new update
    setInterval(check4,2000);
</script>

reblink

<script>
function reblink() {
    $.getScript($('script:first',data).attr('src'), function(){
       eval(blink('.blink'));
    });
    }
</script>

and function that actually do the blink effect

<script type="text/javascript">//<![CDATA[
$(window).load(function(){
function blink(selector){
$(selector).fadeOut('slow', function(){
    $(this).fadeIn('slow', function(){
        blink(this);
    });
});
}

blink('.blink');

});//]]> 

</script>

And after all of those stil ajax call do stop blinking.

Answer 1

This script here has an error in its syntax.

<script>
    function reblink() {
        $.getScript($('script:first',data).attr('src'), function(){
           eval(blink('.blink');); // the (;) is the error  
        });
    //} this closing bracket for the function here is missing
</script>

And here is the correct syntax below.

<script>
    function reblink() {
        $.getScript($('script:first',data).attr('src'), function(){
           eval(blink('.blink'));
        });
    }
</script>

UPDATE

I can see there in your code that you are not calling reblink() function. And you mentioned also there that you want to call reblink() after ajax , you should put reblink() inside in your .done({}); portion of your ajax like this.

.done(function( response ) {   /* update counter */
            $('#message-list1').data('counter',response.current);
            /* check if with response we got a new update */
            if(response.update==true){
                $('#message-list1').html(response.news);
                var audio = new Audio('ding.mp3');
            audio.play();
            reblink() // call reblink here to execute
            }
        });