JavaScript適用於Firefox，但不適用於其他瀏覽器

Question

我對這段代碼不滿意，以嘗試了解它的各個部分如何工作。 一切似乎都能在Firefox中正常運行，但是“登錄”按鈕在任何其他瀏覽器中均不起作用。 當我在Chrome中檢查它時，它說：

未捕獲到的SyntaxError：JSON中位置0處的意外令牌u

在JSON.parse（）

在CheckUsername（alt.html：24）

在HTMLInputElement.onclick（alt.html：72）

在此之前，它一直在抱怨CookieVars變量未定義（我認為，我無法獲取它來再次復制該錯誤）。

我已經嘗試使用Google搜索這個問題，但是其中一些解釋超出了我的理解范圍，或者與我的情況無關。

有人可以告訴我這在Firefox中而不是其他任何瀏覽器中如何工作嗎？ 問題是什么，如何解決？

感謝您的協助。

<!DOCTYPE html>
<html>
<head>
  <title></title>
  <meta charset="UTF-8">
</head>
<script>
function NewMember() {
    var CookieVars = {};

    CookieVars.username = document.getElementById("UsersName").value;
    CookieVars.password = document.getElementById("PassWord").value;

    var jsonString = JSON.stringify(CookieVars);

    document.cookie = "MembersDetails=" + jsonString;
    alert("Thank you, you are now registered.");
    ClearTextBoxes();
}

function CheckUsername() {
    var nameValueArray = document.cookie.split("=");
    var CookieVars = JSON.parse(nameValueArray[1]);
    var UsersNameVar = document.getElementById("UsersName").value;

    if (CookieVars.username == UsersNameVar) {
       CheckPassword();
            } else {
                alert("Username not recognised, please register.");
    }
}

function CheckPassword() {
   var nameValueArray = document.cookie.split("=");
   var CookieVars = JSON.parse(nameValueArray[1]);
   var PassWordVar = document.getElementById("PassWord").value;
   if (CookieVars.password == PassWordVar) {
      document.getElementById("message").innerHTML = "You are now logged in, welcome.";
   } else {
      alert("Incorrect Password.");
   }
}

function ClearTextBoxes() {
    document.getElementById("UsersName").value = "";
    document.getElementById("PassWord").value = "";
}

</script>
<body>
  <table border="3">
    <tr>
      <td>
        Username:
      </td>
      <td>
        <input type="text" id="UsersName">
      </td>
    </tr>
    <tr>
      <td>
        Password:
      </td>
      <td>
        <input type="text" id="PassWord">
      </td>
    </tr>
    <tr>
      <td colspan="2">
        <input type="button" value="Register" onclick="NewMember()">
        <input type="button" value="Login" onclick="CheckUsername()">
        <input type="button" value="Clear Boxes" onclick="ClearTextBoxes()">
      </td>
    </tr>
  </table>
    <p id="message"></p>
<img src="" alt="">
</body>
</html>

Answer 1

除非您使用--enable-file-cookies標志將其啟動，否則Chrome不支持本地文件的Cookie（或像Peter Lyons所述的localhost *）。 您可以在http://code.google.com/p/chromium/issues/detail?id=535閱讀有關此內容的討論。*如果您直接使用本地IP地址（127.0.0.1），Chrome瀏覽器確實支持cookie。 因此在localhost情況下，這可能是一個更容易的解決方法。

Answer 2

驗證您的JSON：

function isJSON(str) {
    try {
        return (JSON.parse(str) && !!str);
    } catch (e) {
        return false;
    }
}

function CheckUsername() {
  var nameValueArray = document.cookie.split("=");
  var CookieVars = (nameValueArray && isJSON(nameValueArray[1])) ? JSON.parse(nameValueArray[1]) : false;
  var UsersNameVar = document.getElementById("UsersName").value;

  if (CookieVars && CookieVars.username == UsersNameVar) {
   CheckPassword();
        } else {
            alert("Username not recognised, please register.");
  }
}

function CheckPassword() {
  var nameValueArray = document.cookie.split("=");
  var CookieVars = (nameValueArray && isJSON(nameValueArray[1])) ? JSON.parse(nameValueArray[1]) : false;
  var PassWordVar = document.getElementById("PassWord").value;
  if (CookieVars && CookieVars.password == PassWordVar) {
     document.getElementById("message").innerHTML = "You are now logged in, 
   welcome.";
 } else {
  alert("Incorrect Password.");
 }
}

這將防止該錯誤。 但是也許您的代碼中仍然存在錯誤，導致將錯誤的數據寫入nameValueArray 。 例如，由於Chrome的Cookie行為。

問候

JavaScript適用於Firefox，但不適用於其他瀏覽器

問題描述

2 個解決方案

解決方案1
0 2017-12-08 14:16:22

解決方案2
0 2017-12-08 14:19:51

JavaScript適用於Firefox，但不適用於其他瀏覽器

問題描述

2 個解決方案

解決方案1 0 2017-12-08 14:16:22

解決方案2 0 2017-12-08 14:19:51

解決方案1
0 2017-12-08 14:16:22

解決方案2
0 2017-12-08 14:19:51