0

Есть сайт с корзиной товаров, клиент набрал товаров, нужно перекинуть данные из переменных на другую страницу что бы показать что купил клиент, далее все это отправить по почте.

var newprice, tovarid, allprice, price;
$(document).ready(function(){
$('#cart > p').toggle(
    function() {
        $("#cart > div").show();
        $("#corner").attr("class","corner-up");
    },
    function(){
        $("cart > div").hide();
        $("corner").attr("class","corner-down");
    }
);
var newcount = 0;
$('.add-tovar').click(function(){
allprice = $('#cart span#price').attr("price");
price = $(this).attr("price");
tovarid = $(this).attr("rel");
newprice = Number(allprice) + Number(price);
newcount++;
$('#cart span#price').html(newprice+' руб. ').attr("price",newprice);
$('#cart span.count').html(newcount);
})
});

1 ответ 1

2

Если нужно только передавать данные между страницами (вкладками), можно использовать, например, localStorage. Одна страница запихивает данные в объект window.localStorage, а другая слушает событие storage и обновляет данные при появлении изменений. Только учтите, что localStorage хранится только в браузере, а для отправки содержимого на сервер (если это понадобится) нужно будет найти другой способ (например, AJAX или Cookies из соседнего ответа).

К сожалению, код ниже не работает прямо на этом сайте, но вы можете запустить его здесь: https://jsfiddle.net/9n981j1u/

Откройте две вкладки (или больше) по ссылке выше, и вы сможете увидеть, как они обмениваются текстом друг с другом.

var mytext = document.getElementById('mytext');
var sendbtn = document.getElementById('sendbtn');
var result = document.getElementById('result');

// Ключ, которым мы будем именовать данные.
// Можно в качестве него использовать любую строку
// на ваш вкус
var key = 'ruso_q_712899_example';

// Отправка сообщения
sendbtn.addEventListener('click', function() {
    window.localStorage[key] = mytext.value;
    getMessageFromLocalStorage();
});

// Приём сообщения
function getMessageFromLocalStorage() {
    result.textContent = window.localStorage[key];
}
window.addEventListener('storage', function(event) {
    if (event.key !== key) {
        return;  // Если прислали не наши данные, ничего не делаем
    }
    getMessageFromLocalStorage();
});

// Если какие-то данные уже лежат в сессии, отображаем
// их сразу после загрузки страницы
getMessageFromLocalStorage();
Введите какой-то текст для отправки:<br/>
<input id="mytext" />
<button id="sendbtn">Отправить во все вкладки</button>
<br/><br/>

Текст, отправленный во все вкладки:
<div id="result">...</div>

3
  • спасибо большое за код, но не могу понять почему он не работает, отдельно на фидле работает, когда пытаюсь использовать в своем коде то не работает, чаще всего ругается на "Uncaught TypeError: Cannot set property 'textContent' of null at getMessageFromLocalStorage ", не могу разобраться почему нул постоянно, думал может это из за того что ничего не добавил еще в корзину. Я как то плохо наверное сочетаю js и jquery, можете подсказать в чем проблема может быть ? почему пустое значение ? задать может быть ему 0, а потом переписывать ? 4 сен 2017 в 13:06
  • Можно как то реализовать работу этого кода без участия кнопок ? Я думаю может с таймингами что то сделать или может можно как то иначе ? 5 сен 2017 в 5:52
  • @ВладиславДементьев можно конечно. Я показал, как общаться с объектом localStorage и как слушать событие изменения - всё остальное переписывайте как вам требуется
    – andreymal
    5 сен 2017 в 6:04

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.