如果浏览器是IE8或Mobile Safari，则尝试编写Cookie；如果使用其他浏览器，则尝试编写本地存储-使用Javascript

Question

So, I have a variable I am creating that is passed along with POST data from a form. Due to some sort of code quirk, any modern browser will create the variable twice, and trigger two different unique id's for the same event, if setting the value of the variable to a cookie. If a modern browser sets the value to localstorage instead, only one unique id is generated and everything works fine.

However, Mobile Safari doesn't treat localstorage as it should be(because Apple moved the directory for localstorage to one that gets emptied randomly), and IE8 fails to set the value to localstorage. In order to bypass these issues, those two browsers should set a cookie instead, which works as intended and generates a single unique identifier for the event.

I cannot just use feature detection, because IE8 technically supports localstorage, but not when the document type of the page is anything other than HTML5. Mobile Safari also supports localstorage, but treats it differently than other modern browsers.

I can tell that the two checks are working to identify Chrome as "anything else", however the unique identifier is showing up as undefined.

What is going wrong with the code below that is preventing the variable from being set and stored in localstorage?

$(document).ready(function() {
if ($.browser.msie && parseInt($.browser.version, 10) === 8) {
    var uuid = $.cookie("uuid");
        if(typeof uuid === 'undefined'){
    var uuid = guid();
            document.cookie='uuid='+uuid;
            var iam = "ie8";
            alert(iam);
  } 
} else {
    if (navigator.userAgent.match(/(iPad|iPhone|iPod touch);.*CPU.*OS 7_\d/i)){
        var uuid = $.cookie("uuid");
            if(typeof uuid === 'undefined'){
                var uuid = guid();
                document.cookie='uuid='+uuid;
                var iam = "safari mobile";
                alert(iam);
            } else {
                if (localStorage.getItem("uuid") === null) {
                    var uuid = guid();
                    localStorage.setItem("uuid", uuid);
                    var iam = "anything else";
                    alert(iam);
                }
            }
    }
}
});

Things to note:

• There is a function that is called in 3 second intervals that posts this data over to a PHP processing file using Ajax.
• There is a function called guid that generates a 20 character unique code.
• Browsers we specifically need to check for: IE8(and possibly below) and Mobile Safari(ie, on iPad, iPhone, or iPod).
• In Google Chrome and Firefox, uuid is undefined with the current script structure, when instead it should be locally stored and feature a string generated by the guid function.
• Above this code are links to jQuery 1.8.2(to gain access to $.browser) and jQuery.cookie.js

Answer 1

You have an else { if () where you likely meant to have else if (){

http://jsfiddle.net/FE2AQ/1/

//$(document).ready(function () { // this isn't really needed
    if ($.browser.msie && parseInt($.browser.version, 10) === 8) {
        var uuid = $.cookie("uuid");
        if (typeof uuid === 'undefined') {
            var uuid = guid();
            document.cookie = 'uuid=' + uuid;
            var iam = "ie8";
            alert(iam);
        }
    } else if (navigator.userAgent.match(/(iPad|iPhone|iPod touch);.*CPU.*OS 7_\d/i)) {
        var uuid = $.cookie("uuid");
        if (typeof uuid === 'undefined') {
            var uuid = guid();
            document.cookie = 'uuid=' + uuid;
            var iam = "safari mobile";
            alert(iam);
        }
    } else {
        if (localStorage.getItem("uuid") === null) {
            var uuid = guid();
            localStorage.setItem("uuid", uuid);
            var iam = "anything else";
            alert(iam);
        }
    }
//});