jQueryUI自动完成与可点击链接?

时间:2012-06-22 02:50:21

标签: jquery ajax jquery-ui autocomplete jquery-ui-autocomplete

这是我第一次使用jQueryUI自动完成功能,我设法让它工作,我们的客户只需要一个功能,即在搜索建议中有可点击的类别。

例如,请看这张图片:

enter image description here

来自newegg网站,当我搜索“nvidia”时,建议列表会填充,除了项目名称之外,还会显示其所在的类别,但该类别显示为文本而非链接(即类别本身不可点击)。我这样做,我从服务器上运行的服务返回搜索结果并填充建议。我不需要返回链接,我可以将返回的字符串拆分为“in”以获取“类别”,然后生成链接  <a href="someinternalpage.aspx?cat=category">Category</a>(此代码仅用于快速创意)。但现在出现了主要问题,如何使用上述可点击链接填充建议?

任何帮助都会受到欢迎。

2 个答案:

答案 0 :(得分:2)

我会点击自动完成公开的select事件并将window.location设置为正确的网址:

select: function (event, ui) {
    var category = $.trim(ui.item.value.split("in")[1])
        , url = "someinternalpage.aspx?cat=" + category;

    event.preventDefault();
    window.location.href = url;
}

答案 1 :(得分:0)

仅基于自动填充的演示页面,似乎这些建议可以定位。

意思是,我会在它们上面注册一个click函数来获取它们的内容,然后使用jQuery重定向窗口,使用正确的URL路径进行搜索(所以类似http://domain.com/search=+content)或使用javascript本身来提交表格。

javascript提交在这里非常详细http://www.javascript-coder.com/javascript-form/javascript-form-submit.phtml

没有任何代码,这就是我解决问题的方法。