无法通过AJAX存储localstorage值

时间:2015-02-08 16:18:31

标签: php jquery ajax local-storage

请帮忙, 我有一组动态生成的按钮递增输入。首先我将id和值存储到localstorage中,一切正常,我可以看到所有的id-value对,但我无法使用AJAX调用发送数据。 这是它的样子:

按下按钮分配AJAX:

<script>
        $("#send_order").click(function (e) {
            if (localStorage) {
                if (localStorage.length) {
                    for (var i = 0; i < localStorage.length; i++) {
                        var pid = localStorage.key(i);
                        var value = localStorage.getItem(localStorage.key(i));

                        $.ajax({                                
                            url: "update.php?pid="+pid+"&qty="+value,
                            success: function(){
                                alert( "Прибыли данные: ");
                            }
                        });

                    }
                } else {
                    output += 'Нет сохраненных данных.';
                }
            } else {
                output += 'Ваш браузер не поддерживает локальное хранилище.';
            }
            )};
    </script>

但点击按钮时没有任何反应。 我做错了什么?

1 个答案:

答案 0 :(得分:1)

虽然您的代码看起来很好,但在循环中逐个发送本地存储数据效率不高。将localstorage转换为json字符串并同时发送所有内容更有意义。您可以在php更新脚本中json_decode json字符串。我还包括一个函数,通过尝试写入localStorage来测试它是否可用。这比if(localStorage)

更可靠
 $("#send_order").on("click", function () {   
    var output='';
    if(localStorageTest() === true){
        console.log('localStorage is available');
        if(localStorage.length){
            var data=JSON.stringify(localStorage);
            $.ajax({ 
                    type: "GET",                               
                    url: "update.php?data="+data,
                    success: function(){
                               alert( "your data is send correctly!");
                    }
            }); 

        }else{
           output += 'localStorage is empty\n';     
        }
    }else{
        output += 'localStorage is not available\n';
    }
})

function localStorageTest(){
    var test = "test";
    try {
        localStorage.setItem(test, test);
        localStorage.removeItem(test);
        return true;
    } catch(e) {
        return false;
    }
}