javascript - 存储和检索搜索结果

Question

我对一段代码有点困惑。我有一个搜索字段，它调用一个 PHP 函数来查找数据库:

$this->_helper->layout->disableLayout();
$q = $this->getRequest()->getParam('q');

 $product_db = new Products();
 $this->view->products = $product_db->searchProduct($q);
 foreach($this->view->products as $product)
 {
      ....
 }

结果通过 JQuery 加载到我的 HTML 页面中:

var searchItem = function() {
    if($('#json_search').val())
    {
        $('#search-resultlist').load('/search/quick/q/'+ $('#json_search').val() );
    }
    else {
        $('#search-resultlist').html('');
    }
}

HTML:

<div class="right-searchcontent" >
  <input type="text" class="form-control" placeholder="Search ... " id="json_search">
</div>
<div class="right-searchresult">
  <ul id="search-resultlist" >
    <li >

    </li>
  </ul>
</div>

现在基本上我试图实现的是创建“搜索历史记录”。起初，我在搜索 Controller 中使用 SESSION 数组进行了尝试:

if(!isset($_SESSION['history'])) {
  $_SESSION['history'] = array();
}

并在我的函数中显示数据库搜索结果:

if(!empty($product)){
  if(!in_array($product->naam, $_SESSION['history']))
  {
    $_SESSION['history'][] = $product->naam;
  }
 }

但这存储了我搜索过的所有值(例如:“sk”、“ah”)我只想要我实际点击的值。

有人能指出我正确的方向吗？

我一直在尝试使用 localStorage 来实现我的结果，但这不会给我正确的解决方案。我还尝试使用 Cookie 来实现此功能:

var cookieList = function(cookieName) {
    var cookie = $.cookie(cookieName);
    var items = cookie ? cookie.split(/,/) : new Array();

    return {
        "add": function(val) {
            //Add to the items.
            items.push(val);
            //Save the items to a cookie.
            $.cookie(cookieName, items.join(','));
        },
        "remove": function (val) {
            indx = items.indexOf(val);
            if(indx!=-1) items.splice(indx, 1);
            $.cookie(cookieName, items.join(','));        },
        "clear": function() {
            items = null;
            //clear the cookie.
            $.cookie(cookieName, null);
        },
        "items": function() {
            return items;
        }
      }
}

但是当我尝试提醒 list.items 时，它只是返回了整个方法。

当我点击它时，我可以实现产品名称，但我只是不知道如何将其存储到 session 中或其他我可以在任何页面上随时实现的东西。

$(document).on('click', 'a.searchItem', function(e){
  e.preventDefault();
  var search = $(this).attr('value'));
});

Answer 1

我已经用已有的功能修复了:

var cookieList = function(cookieName) {
    var cookie = $.cookie(cookieName);
    var items = cookie ? cookie.split(/,/) : new Array();

    return {
        "add": function(val) {
            //Add to the items.
            items.push(val);
            //Save the items to a cookie.
            $.cookie(cookieName, items.join(','));
        },
        "contain": function (val) {
        //Check if an item is there.
        if (!Array.prototype.indexOf) {
            Array.prototype.indexOf = function(obj, start) {
                for (var i = (start || 0), j = this.length; i < j; i++) {
                    if (this[i] === obj) { return i; }
                }
                return -1;
            };
        }
        var indx = items.join(',').indexOf(val);
        if(indx > -1){
            return true;
        }else{
            return false;
        }                                                 },
        "remove": function (val) {
            indx = items.indexOf(val);
            if(indx!=-1) items.splice(indx, 1);
            $.cookie(cookieName, items.join(','));        },
        "clear": function() {
            items = null;
            //clear the cookie.
            $.cookie(cookieName, null);
        },
        "items": function() {
            return items;
        }
    }
}

当有人点击搜索结果时，它会添加到 Cookie 列表中:

$(document).on('click', 'a.searchItem', function(e){
  var search = $(this).attr('value');
  var list = new cookieList("MyItems");
  if(!list.contain(search)){
    list.add(search);
  }
});

打开搜索框时，我会显示列表结果:

jQuery.each(list.items(), function(index, value){
  ....
});

也许这有时会对某人有所帮助..