ajax搜索与hashbag问题的深层链接

时间:2013-11-17 22:21:09

标签: jquery ajax hash deep-linking

我正在尝试使用深层链接构建ajax搜索,到目前为止我的代码看起来如下。这个区域对我来说很新,我正在努力了解基础知识。以下内容应从UI滑块中选取值并将其传递给执行ajax调用的搜索方法。另一方面,在页面加载时,我想检查是否有哈希标记并调用前面提到的方法。这个工作正常,但鼠标上升事件无法获得调用的搜索方法

$(document).ready(function() {

    $('.layout-slider').on('mouseup', function(event) {
        event.preventDefault();
        facet = $(this).find(':input').attr('name')
        values = $(this).find(':input').val();
        console.log(facet);
        console.log(values);
        var url = facet + "=" + values;
        window.location.hash = "#!" + url;

    });

});

  if (window.location.hash) {
        search();
    }


function search(){
    var hash = window.location.hash.substring(1); //Puts hash in variable, and removes the # character
        console.log(hash);
        $.post("site/ajax", function() {
            console.log("Load was performed.");
        });
}

1 个答案:

答案 0 :(得分:0)

您没有通过鼠标注册事件调用搜索功能。您只需在网址上附加主题标签即可。只需将search()添加到其末尾即可。

$(document).ready(function() {
    $('.layout-slider').on('mouseup', function(event) {
        event.preventDefault();
        facet = $(this).find(':input').attr('name')
        values = $(this).find(':input').val();
        console.log(facet);
        console.log(values);
        var url = facet + "=" + values;
        window.location.hash = "#!" + url;
        search();
    });
});

我不确定你到底想要做什么,但是从快速查看我会亲自通过将参数传递给搜索功能来实现它,例如。

function search(value){
   $.post("site/ajax", function() {
      console.log(value);
   });
}

$(function(){
   if (window.location.hash) {
      search(window.location.hash.substring(1));
   }
   $('.layout-slider').on('mouseup', function(event) {
      event.preventDefault();
      var facet = $(this).find(':input').attr('name')
      var values = $(this).find(':input').val();
      var url = "#!" + facet + "=" + values;
      search(url);
   });
}