使用JavaScript删除带有按钮的Cookie

Question

我已经为此烦恼了几天，但我精疲力尽，需要指导。 我是JavaScript的新手，所以我提前致歉。 我的目标是从表单中获取3个输入并将其保存到Cookie中。 这是html表单部分：

<form name="userData" action="">

        <fieldset align="center">
            <legend align="center">Create a User Account</legend>

            <label>First Name: </label>
            <span>
                <input type="text" size="25" name="field1">
            </span>

            <label>Password: </label>
            <span>
                <input type="text" size="25" name="field2">
            </span>

            <label>Email: </label>
            <span>
                <input type="text" size="25" name="field3">
            </span>
        </fieldset>
    </form>
</div>  

<div align="center">
    <input type="submit" value="Set Cookies" onClick="setCookies();">
    <input type="submit" value="Show Cookie Data" onClick="showCookies();">
    <input type="button" value="Clear Cookies" onClick="clearCookies();">
</div>

提交表单数据后，用户应该会看到一个弹出窗口，显示刚填写的表单中的cookie信息。 请记住，在填写所有三个字段之前，他们应该无法提交表单。 这是到目前为止我编写的Javascript函数，第一个是设置cookie并显示弹出窗口：

function setCookies()
{
  if (document.userData.field1.value == "")
  {
    alert("Please Fill In All Form Values!");
    return;
  }

  else if (document.userData.field2.value == "")
  {
    alert("Please Fill In All Form Values!");
    return;
  }

  else if (document.userData.field3.value == "")
  {
    alert("Please Fill In All Form Values!");
    return;
  }

  else
  {
    cookievalue1 = escape(document.userData.field1.value);
    document.cookie = cookievalue1;

    cookievalue2 = escape(document.userData.field2.value);
    document.cookie = cookievalue2;

    cookievalue3 = escape(document.userData.field3.value);
    document.cookie = cookievalue3;

    alert("The Following Data Has Been Saved To a Cookie:\n" + "\nFirst Name = " + cookievalue1 + "\nPassword = " + cookievalue2 + "\nEmail = " + cookievalue3);
  }
}

现在，此功能绑定到第二个按钮，该按钮仅显示提交时保存的cookie：

function showCookies()
{
  alert("First Name: " + cookievalue1 + "\nPassword: " + cookievalue2 + "\nEmail: " + cookievalue3)
}

我不知道该做什么的第三个按钮（应该用来擦掉cookie的那个按钮）。 非常感谢任何指导。 我所拥有的只是函数中的此警报，当按下按钮并且执行逻辑（尚不存在）时，该警报应该显示：

function clearCookies()
{
  alert('Your Coookies Have Been Deleted')
}

再说一次，如果有人对简化有任何建议，我愿意接受。 我再也看不清楚了，我的眼睛感觉像酸，我可以感觉到头上的头发变白了。

Answer 1

您可以看到所有W3C示例 ，就可以了！

使用JavaScript删除Cookie

删除Cookie非常简单。 只需将expires参数设置为通过日期即可：

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";

Answer 2

您可以通过将cookie的expires参数设置为已过的日期来删除它。 例如：

document.cookie = "username=; expires=Thu, 01 Jan 1970 00:00:00 GMT";

w3schools的示例与您尝试执行的操作非常相似。 在此处查看： http : //www.w3schools.com/js/js_cookies.asp 。