JavaScript: 两个相等的字符串不相等

Question

我正在尝试学习设置和获取 cookie。我有一个简单的表单，用户可以在其中设置一个 cookie，然后尝试检索 cookie 值。我将 document.cookie 字符串拆分成多个部分并查找与给定名称匹配的现有 cookie 名称。当我找到我要查找的名称时，也许 "a"，我有一个测试名称 "a" 和一个等于 "a" 的 cookie 片段，但它们没有注册为相等。

在表单中输入"a"，"b"，set cookie表单中输入1，get cookie表单中输入"a"。警报会显示我的意思。

代码如下：http://plnkr.co/edit/Gy2uoEz1G5lYoub8oeE1?p=preview

我更喜欢 jsfiddle，但它会弄乱 cookies。

index.html

<!doctype html>

    <html lang="en">
    <head>
      <meta charset="utf-8">

      <title>Cookie Test</title>
      <meta name="description" content="Cookie Test">

      <!--link rel="stylesheet" href="css/styles.css?v=1.0"-->

        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>

        <script src="cookie_test.js"></script>

        <script type="text/javascript">
          //$(document).ready(function(){alert("document ready");});
        </script>

    </head>

    <body>

        <form id="set-cookie-form">
        <fieldset>
                <legend>Set Cookie</legend>
                <label>Name</label>
                <input type="text" name="set-name" id="set-name" />
                <label>Value</label>
                <input type="text" name="set-value" id="set-value" />
                <label>Value</label>
                <input type="number" name="set-days" id="set-days" />
                <input type="button" name="set-cookie" id="set-cookie" value="Set Cookie" />
                <p>Cookie String: <span id="cookie-text"></span></p>
            </fieldset>
        </form>

        <form id="get-cookie-form">
            <fieldset>
                <legend>Get Cookie</legend>
                <label>Name</label>
                <input type="text" name="get-name" id="get-name" />
                <input type="button" name="get-cookie" id="get-cookie" value="Get Cookie" />
                <p>Cookie Value: <span id="cookie-value"></span></p>
            </fieldset>
        </form>

    </body>
    </html>

cookie_test.js

$(document).ready(function(){
    $('#set-cookie').on('click', function(){
        //alert("set cookie clicked");
        setCookie($('#set-name').val(), $('#set-value').val(), $('#set-days').val());
    });

    $('#get-cookie').on('click', function(){
        //alert("get cookie clicked");
        var value = getCookie($('#get-name').val());
        $('#cookie-value').text(value);
    });

});

function setCookie(name, value, num_days) {
    var cookie_text = name + "=" + value;
    var expires = "";
    if (num_days > 0) {
        var date = new Date();
        date.setTime(date.getTime() + (num_days * 24 * 60 * 60 * 1000));
        expires = "; expires=" + date.toGMTString();
    } else {
        expires = "";
    }
    cookie_text += expires + "; path=/";
    //alert(cookie_text);
    document.cookie = cookie_text;
    $('#cookie-text').text(cookie_text);
    //alert(document.cookie);
}

function getCookie(name) {
    //alert("get cookie " + name);
    var current_cookie = document.cookie;
    //alert("current cookie: " + current_cookie);
    var cookie_pieces = current_cookie.split(';');
    //alert(cookie_pieces[0]);
    for (var i = 0; i < cookie_pieces.length; i++) {
        //alert(cookie_pieces[i]);
        var key_val_pair = cookie_pieces[i].split("=");
        var current_key = key_val_pair[0];
        alert(
          "name="+name+";"+"type of name="+(typeof name)+";"
          +"current_key="+current_key+";"
          +"typeof current_key="+(typeof current_key)+";"
          +"(current_key==name)="+(current_key==name)
          );
        if (key_val_pair[0] == name) {
            alert("found it");
            $('#cookie-value').text(key_val_pair[1]);           
            return key_val_pair[1];
        }
    }
    return null;
}

function eraseCookie(name) {
    createCookie(name, "", -1);
}

Answer 1

仔细查看 alert(document.cookie) 警报。似乎字符串 it returns 中的键值对由分号 (;) 和空格 (</code>) 彼此分隔.所以你需要分开。</p> <p>如果不这样做，您的比较看起来像这样，因为没有删除多余的空格：</p> <pre><code>'a' == ' a' // False!

您只需更改这一行:

var cookie_pieces = current_cookie.split(';');

对此:

var cookie_pieces = current_cookie.split('; ');

http://plnkr.co/edit/WkBfD7pU10cMwJQxyIp0?p=preview

Answer 2

从运行到它在迭代中返回 key_val_pair[0] 的值与“ a” 所以当将它与 "a" 比较时它然后失败了。

我已通过添加 space 的替换来修复它，这解决了您的问题。而且我还像 current_key 一样修复了变量名称，但随后将 if 语句作为 (key_val_pair[0] == name) 进行了修改，因此它不会检查新格式。

function getCookie(name) {
    //alert("get cookie " + name);
 var current_cookie = document.cookie;
 //alert("current cookie: " + current_cookie);
 var cookie_pieces = current_cookie.split(';');
 //alert(cookie_pieces[0]);
 for (var i = 0; i < cookie_pieces.length; i++) {
  //alert(cookie_pieces[i]);
  var key_val_pair = cookie_pieces[i].split("=");
  var current_key = key_val_pair[0].replace(" ", "");
  alert(
    "name="+name+";"+"type of name="+(typeof name)+";"
    +"current_key="+current_key+";"
    +"typeof current_key="+(typeof current_key)+";"
    +"(current_key==name)="+(current_key==name)
    );
  if (current_key == name) {
   alert("found it");
   $('#cookie-value').text(current_key);   
   return current_key;
  }
 }
 return null;
}

JavaScript: 两个相等的字符串不相等

JavaScript: two equal strings not being equal

javascript

cookies