Простая корзина покупок с использованием JavaScript Cookie

У меня есть следующий код для реализации простой корзины для покупок с использованием JavaScript. Существует ссылка для оформления заказа, которая вызывает getcookie() для проверки значения сохраненных файлов cookie. Если в файле cookie ничего нет, нажмите на предупреждение о ссылке, чтобы ввести данные. Если ни одно из значений не введено в поле ввода и вы нажали «Добавить в корзину», выполняется проверка и выдается сообщение об ошибке.

По какой-то причине cookie не принимает значение из поля ввода. Я пытался довольно долго, но не смог отладить код. Наконец отображается пустое окно предупреждения. Я ценю любую отладку. Заранее спасибо.

<script type="text/javascript">
    var value;
    var productID;

    function setItem(abd) {
        value = abd.value;
        productID = abd.getAttribute("productID");
        var intRegex = /^\d+$/;
        var numberOfItems;
        if (!intRegex.test(value) || (value <= 0)) {
            alert('Please Enter valid numberofitem');
        } else {
            numberOfItems = value;
        }
    }
    function getCookie() {
        if (value == undefined) {
            alert("There is nothing in the shopping cart!");
        } else {
            var cookieArray = document.cookie.split(';');
            var printHolder = "";
            for (var i = 0; i < cookieArray.length; ++i) {
                var pairArray = cookieArray[i].split('=');
                alert(pairArray[0]);
            }
            alert(printHolder);
        }
    }
    function setCookie() {
        if (value == undefined) {
            alert("Please add number of items in text box");
        } else {
            document.cookie = productID + "=" + value + "; ";
            alert(value + " Product(s) with id " + productID +
                " has been added to shopping cart!");
        }
    }

</script>
<a href="javascript:getCookie()"> Checkout </a>
<input name="item-select" id="item-select"
       productid="p001"  style="width: 50px" onBlur="setItem(this)" >
<button type="button" onclick="setCookie()">Add to cart.</button>

Результат, который я хотел, это что-то вроде этого, наконец!

введите здесь описание изображения


javascript html cookies setcookie shopping-cart
person Dinesh Devkota    schedule 16.03.2014    source источник

Ответы (2)


arrow_upward
4
arrow_downward

Этот код прекрасно работает с некоторыми изменениями. Я использовал Chrome и позже обнаружил, что

Google Chrome не создает файлы cookie, когда файл находится на local machine и загружается в браузер напрямую, используя путь к файлу.

Скорее попробуйте с localhost. Это определенно работает, когда вы помещаете код на сервер. Chrome стал настоящей занозой здесь!

Если вам нужна идея создания корзины покупок с помощью Javascript, перейдите по этой ссылке. http://www.smashingmagazine.com/2014/02/create-client-side-shopping-cart/

person Dinesh Devkota    schedule 18.03.2014

arrow_upward
-1
arrow_downward

Ваш getCookie, скорее всего, даст вам неправильные результаты.

var cookiearray= document.cookie.split(';');
var toprint="";
for(var i=0; i<cookiearray.length; ++i) 
{ 
    var pairArray= cookiearray[i].split('=');
    alert(pairArray[0]);
}
alert(toprint);

Две вещи здесь не так;

1) Когда вы находитесь в своем цикле for, каждый раз, когда вы выполняете цикл, вы все время предупреждаете первый элемент в своем массиве pairArray[0], вам нужно изменить его на pairArray[i]

2) У вас отображается пустое предупреждение, потому что это то, что вы присвоили переменной toprint. – Вы назначаете для печати пустую строку перед циклом for, затем вы оповещаете эту переменную, не присваивая ей новое значение, так что вы будете отображается с пустым окном предупреждения! – Также убедитесь, что ваш массив файлов cookie не пуст.

Попробуйте, наслаждайтесь кодированием :)

Куш

person Kush    schedule 17.03.2014
comment
Судя по всему, я это уже пробовал. К сожалению, это не сработало. - person Dinesh Devkota; 17.03.2014
comment
Приятель! Этот абд принимает (этот) объект. Ты хоть знаешь, о чем говоришь? - person Dinesh Devkota; 17.03.2014