Question

我有一个下拉菜单，根据用户选择设置一个cookie，这是回发邮件，此时设置cookie。为了给你一个更多的上下文，网站是一个目录，用户进入他们的选择，然后他们搜索。在显示的产品的顶部有一种方法可以对列表进行排序，这是设置cookie的位置。这适用于正常情况，直到客户进行新搜索或重置搜索。因为排序有一个cookie，它不会直接与搜索cookie相关联，并始终显示所选内容，即使现在可能没有在新搜索完成后按此方法排序。

所以我正在寻求有关如何在选择按钮时删除此cookie集的帮助，此按钮是：

  <a id="dnn_ctr555_ProductSearch_rpData_cmdAdvSearch_0" class="postbacklink searchpostbacklink nb-catfilter-search" href="javascript:__doPostBack('dnn$ctr555$ProductSearch$rpData$ctl00$cmdAdvSearch','')">Search</a>

为您提供下拉菜单的Cookie和工作方式的详细信息，如下所示：

 <!-- List header -->
 <select id="Selection" class="sorter" onchange="document.cookie= 'myDDIdx = ' + this.selectedIndex + '; path=/;';location=this.options[[this.selectedIndex]].value" style="float:right;margin-right:8px;">
  <option value="">Sort by</option>
  <option value="?orderby=0">Code</option>
  <option value="?orderby=1">Title A-Z</option>
  <option value="?orderby=2">Title Z-A</option>
  <option value="?orderby=3">Brand</option>
  <option value="?orderby=4">Lowest price</option>
  <option value="?orderby=5">Highest price</option>
  <option value="?orderby=6">Lowest Quantity</option>
  <option value="?orderby=7">Highest Quantity</option>
  </select>
  <div style="clear:both;"></div>


  <script>
      var sidx = document.cookie.indexOf("myDDIdx");
       if(sidx != -1)
      window.onload = function () { document.getElementById("Selection").selectedIndex =                     document.cookie.substr(sidx + 8,1); }
  </script>

任何代码片段都会非常受欢迎，因为我觉得我的头撞在了一堵砖墙上。

Answer 1

最初的document.cookie API很糟糕。您应该添加以下代码段，而不是尝试直接访问它：

https://developer.mozilla.org/en-US/docs/Web/API/document.cookie#A_little_framework.3A_a_complete_cookies_reader.2Fwriter_with_full_unicode_support

var docCookies = {
  getItem: function (sKey) {
    return decodeURIComponent(document.cookie.replace(new RegExp("(?:(?:^|.*;)\\s*" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=\\s*([^;]*).*$)|^.*$"), "$1")) || null;
  },
  setItem: function (sKey, sValue, vEnd, sPath, sDomain, bSecure) {
    if (!sKey || /^(?:expires|max\-age|path|domain|secure)$/i.test(sKey)) { return false; }
    var sExpires = "";
    if (vEnd) {
      switch (vEnd.constructor) {
        case Number:
          sExpires = vEnd === Infinity ? "; expires=Fri, 31 Dec 9999 23:59:59 GMT" : "; max-age=" + vEnd;
          break;
        case String:
          sExpires = "; expires=" + vEnd;
          break;
        case Date:
          sExpires = "; expires=" + vEnd.toUTCString();
          break;
      }
    }
    document.cookie = encodeURIComponent(sKey) + "=" + encodeURIComponent(sValue) + sExpires + (sDomain ? "; domain=" + sDomain : "") + (sPath ? "; path=" + sPath : "") + (bSecure ? "; secure" : "");
    return true;
  },
  removeItem: function (sKey, sPath, sDomain) {
    if (!sKey || !this.hasItem(sKey)) { return false; }
    document.cookie = encodeURIComponent(sKey) + "=; expires=Thu, 01 Jan 1970 00:00:00 GMT" + ( sDomain ? "; domain=" + sDomain : "") + ( sPath ? "; path=" + sPath : "");
    return true;
  },
  hasItem: function (sKey) {
    return (new RegExp("(?:^|;\\s*)" + encodeURIComponent(sKey).replace(/[\-\.\+\*]/g, "\\$&") + "\\s*\\=")).test(document.cookie);
  },
  keys: /* optional method: you can safely remove it! */ function () {
    var aKeys = document.cookie.replace(/((?:^|\s*;)[^\=]+)(?=;|$)|^\s*|\s*(?:\=[^;]*)?(?:\1|$)/g, "").split(/\s*(?:\=[^;]*)?;\s*/);
    for (var nIdx = 0; nIdx < aKeys.length; nIdx++) { aKeys[nIdx] = decodeURIComponent(aKeys[nIdx]); }
    return aKeys;
  }
};

然后，您可以在单击按钮时执行此操作：

docCookies.removeItem("myDDIdx");

此外，您可以将原始cookie设置器代码简化为以下内容：

<select id="Selection" class="sorter" onchange="docCookies.setItem('myDDIdx', this.selectedIndex); location=$(this).val();" style="float:right;margin-right:8px;">

（不知道设置位置变量的原因是什么，虽然我已经简化了它，假设你加载了jQuery，因为你的问题是用jQuery标记的）

Answer 2

如果您有cookie名称，那么纯javascript：

        var Cookienames = ['cookie1', 'cookie2', 'cookie3'];
            function clearCookies(Cookienames){
                for(i=0; i <= Cookienames.length; i++){
                    document.cookie = Cookienames[i] + '=;expires=Thu, 01 Jan 1970 00:00:01 GMT;';  
                }
            }

将此功能称为要删除Cookie的位置。 clearCookies（Cookienames）;

此外，如果您使用父域设置跨浏览器cookie，则：

 function clearCookies(Cookienames){
                for(i=0; i <= Cookienames.length; i++){
                    document.cookie = Cookienames[i] + '=;expires=Thu, 01 Jan 1970 00:00:01 GMT;domain=".xyz.com";path=/';  
                }
            }

按下按钮时删除特定cookie

2 个答案: