Отображение div с использованием jquery и получение данных с сервера ape

Question

Мой вопрос: как я могу сделать div, который виден в правом нижнем углу экрана в течение 10 секунд? Этот div запускает встроенный push-запрос ape-сервера, который запускается скриптом php. Я хотел бы попробовать отправить данные с php на сервер обезьян, а затем отобразить эти данные с помощью jquery с div, который отображается в течение x секунд. Я не сомневаюсь, как бы я начал или как я мог заставить это работать!

Answer 1

Вы говорите о двух разных вещах здесь, я думаю...

Либо вам нужна серверная функция с использованием php (а затем с помощью jQuery, чтобы показать / скрыть div), либо запрос AJAX с использованием jQuery. Поскольку вы, кажется, не хотите перезагружать страницу при выполнении всего этого, я бы выбрал опцию AJAX.

Примерный способ сделать это с AJAX будет следующим:

У вас должна быть запущена служба, на которой вы можете публиковать свои данные, которая будет предоставлять ответ для показа на странице. Это может быть закодировано в php.

Затем с jQuery вы бы сделали что-то вроде:

$(function(){
    // use jQuery's .post() shorthand method to post your data to your php script
    $.post('myService.php', function(data){
        // do something with whatever is returned by your php function... 
        // in this instance, show a div containing the response 
        // (assuming the response is html)
        $('#responseDiv').empty().append(data).fadeIn(500, function(){
            // in this callback (which runs once the fadeIn animation is complete), 
            // we will tell #responseDiv to disappear after 10 seconds
            setTimeout(function(){
                $('#responseDiv').fadeOut(500);
            }, 10000);
        });
    });
});

Я надеюсь, что это поможет ответить на ваш вопрос.

// РЕДАКТИРОВАТЬ: В ответ на ваш комментарий, кажется, что документация APE показывает вам, как это сделать -

var client = new APE.Client();

client.load();

client.core.join('testChannel');

client.request.send('foo', {ping: 'ho hey'});

client.onRaw('bar', function(raw, pipe) {
    console.log('echo : ' + raw.data.echo);
    console.log('Receiving : ' + raw.data.hello);
});

Метод client.request.send() отправляет данные на сервер, а затем метод client.onRaw() - это то, как вы работаете с ответами, судя по всему. В этом случае это просто выход из системы на консоль, но принцип звучит разумно. Этот onRaw ищет сырой с типом "бар", судя по всему.

Предлагаю вам внимательно прочитать документацию APE. У меня было 5 минут чтения, и я зашел так далеко, но на самом деле не будучи экспертом APE, я не могу пойти намного дальше, не потратив много времени на исследования.

// РЕДАКТИРОВАТЬ 2

Если это просто то, что сообщение появляется в div, а затем исчезает, что является вашей проблемой здесь, тогда часть моего первоначального ответа остается верной:

    $('#responseDiv').empty().append(data).fadeIn(500, function(){
        // in this callback (which runs once the fadeIn animation is complete), 
        // we will tell #responseDiv to disappear after 10 seconds
        setTimeout(function(){
            $('#responseDiv').fadeOut(500);
        }, 10000);
    });

Этот раздел скрипта добавит содержимое данных в div, затем добавит его, а затем исчезнет через 10 секунд. Все, что вам нужно сделать, это отсортировать, используя ответ от APE вместо этой переменной данных (заменить data с raw.data, Я думаю).

Если вам нужно создать div на лету, то вы можете сделать что-то вроде:

    // your css would need to set .response to be display: none
    $('body').append('<div class="response">'+raw.data+'</div>');
    $('.response').fadeIn(500, function(){
        // in this callback (which runs once the fadeIn animation is complete), 
        // we will tell .response to disappear after 10 seconds
        setTimeout(function(){
            $('.response').fadeOut(500);
        }, 10000);
    });

Это поможет вам с вашей проблемой?