problem ajax load with autocomplete.?

i created a jquery autocomplete it work true, but loading LOADING... it after removed value by Backspace don't work true. it not hide and Still is show.

how can after removed value by Backspace, hide LOADING... ?

EXAMPLE: Please click on link and see problem

my full code:

$(document).ready(function () {

/// LOADING... ///////////////////////////////////////////////////////////////////////////////////////

    $('#loadingDiv')
    .hide()  // hide it initially
    .ajaxStart(function() {
        $(this).show();
    })
    .ajaxStop(function() {
        $(this).hide();
    });

/// autocomplete /////////////////////////////////////////////////////////////////////////////////////////            
    $('.auto_complete').keyup(function () {
        var specific = '.' + $(this).closest('div.auto_box').find('b').attr('class');
        var cl_list = '.' + $(this).closest('div.auto_box').find('ul').attr('class');        
        var id = '#' + this.id;
        var url = $(id).attr('class');
        var dataObj = $(this).closest('form').serialize();
        $.ajax({
            type: "POST",
            dataType: 'json',
            url: url,
            data: dataObj,
            cache: false,            
            success: function (data) {
                //alert(url)
                var cl_list = '.' + $('.auto_box '+ specific +' ul').attr('class');
                var id_name = $(cl_list).attr('id');
                $(cl_list).show().html('');
                if (data == 0) {
                    $(cl_list).show().html('<p><b>There is no</b></p>');
                }
                else {
                    $.each(data, function (a, b) {
                        //alert(b.name)
                        $('<p id="' + b.name + '">' + b.name + '</p>').appendTo(cl_list);
                    });

                    $(cl_list + ' p').click(function (e) {
                        e.preventDefault();
                        var ac = $(this).attr('id');
                        $('<b>' + ac + '، <input type="text" name="'+id_name+'[]" value="' + ac + '" style="border: none; display: none;" /></b>').appendTo($('.auto_box ' + specific + ' span'));
                        $(this).remove();
                        return false;
                    });
                    $('.auto_box span b').live('click', function (e) {
                        e.preventDefault();
                        $(this).remove();
                        return false;
                    });
                }        
                if ($(specific + ' input').val() == '') {
                    $(cl_list + " p").hide().remove();
                    $(cl_list).css('display','none'开发者_如何学编程);
                    $(".list_name").show().html('');
                };
                $('body').click(function () {
                    $(cl_list + " p").hide().remove();
                    $('.auto_complete').val('');
                    $(cl_list).show().html('');
                    $(cl_list).css('display','none')
                });
            },
            "error": function (x, y, z) {
                // callback to run if an error occurs
                alert("An error has occured:\n" + x + "\n" + y + "\n" + z);
            }
        });
    });
});

I recommend you to use jsfiddle next time you post code examples in a link.

Nevermind. The "loading" message keeps there because there's no fallback to empty values on results.

A quick fix could be just by test that there's a value in the input before making any post like if(this.value == ""){ $(cl_list).css('display', 'none'); return false; }

Here's how it works with it