Откройте div на странице в новом окне, сохраняя при этом возможность обновлять его через websockets

#javascript #jquery #backbone.js

#javascript #jquery #backbone.js

Вопрос:

Я пытаюсь открыть раздел страницы (где у меня есть уведомления) в новом окне (новое окно браузера), сохраняя при этом возможность получать обновления websocket, чтобы уведомления можно было получать в обоих окнах, когда что-то обновляется.

Мне интересно, есть ли возможность сделать это с помощью jQuery или любого другого метода. Структура, которую я использую, является основной, если это имеет значение.

Заранее спасибо за любые идеи!

Комментарии:

1. Если окно открыто с помощью JS, оно доступно через JS, поэтому можно выполнять манипуляции с DOM. Сокеты не имеют к этому никакого отношения.

2. Что вы имеете в виду? Если я открою совершенно новое окно через JS, как оно будет продолжать получать обновления websocket? Было бы здорово немного больше объяснений. Заранее спасибо!

3. Окно НЕ получает «обновления weboscket». Клиент websocket получает данные. Забудьте о websockets на данный момент. Думайте только о данных , которые у вас уже есть под рукой. Теперь я хочу сказать, что вы МОЖЕТЕ обновить элемент в другом окне с помощью этих данных.

4. О, я понимаю, о чем вы говорите. в принципе, получить его в одном месте и обновить в другом, имеет смысл. Есть ли способ, которым вы можете помочь, предоставив пример того, как открыть что-то в новом окне и продолжить обновлять его из другого? Опять же, спасибо за помощь 🙂

Ответ №1:

Попробуй

HTML

 <textarea placeholder="click `open popup`
to open and update"></textarea>
<br />
<input type="button" value="open">
<input type="button" value="close">
 

js

 $(function () {
    $("input[value=open]").focus().one("click", function () {
        $("body").append("<br /><span class=update></span>");
        var popup = window.open("", "popup", "width=200, height=100");
        popup.document.write("popup ready");
        $(".update").html("popup ready");
        popup.focus();

        $("textarea").on("change", function (e) {
            popup.document.write($(this).val()   "<br />");
            $(".update").html(function (i, o) {
                return o   $(e.target).val()   "<br />";
            });
            $(this).val("");
            return popup.focus();
        }).change();

        $("input[value=close]").on("click", function () {
            popup.close();
            return $("textarea").attr("placeholder", "popup closed");
        });
        return $("textarea").attr("placeholder", "popup ready to update");
    });    
});
 

jsfiddle http://jsfiddle.net/guest271314/b2e7t /