5

我试图寻找类似的情况,我发现每一次,代码略有不同,我不管理找到解决方案的一些,但...

jQueryUI的自动完成功能可点击结果

我在我的网站上使用jQuery Autocomplete从MySQL数据库获取数据。
结果按类别排序,以同样的输入显示产品和品牌
所以我自然地从他们的网站上粘贴了我的例子,它工作正常!
生成的JSON这个样子

{"label":"Product 1","url":"product.php?id=1","category":"Products"} 

我唯一的问题是,我想结果是点击。所以当用户点击一个结果时,会加载另一个页面,而不是用数据填充输入的默认行为。

我已经创建了的jsfiddle演示,所以你可以看到发生了什么
http://jsfiddle.net/fJ22W(的数据都是包含在这里的JS)

你的帮助是更受欢迎,我想这不是什么大不了的,但我在jQuery的技能差阻止我解决这个问题......

伯特兰

+0

是你的小提琴的工作? –

+0

你是对的,它没有工作 修正:http://jsfiddle.net/fJ22W/2/ – Bertrand

回答

6

使用select事件:

$("#search").catcomplete({ 
     source: 'suggest_zip.php', 
     select: function(event, ui) { 
      window.location = ui.item.url; 
     } 
    }); 

很明显,你会希望有各地的URL等

一些验证对于什么是值得我也建议使用默认的自动完成构件和使用的事件和选择,而不是试图从它继承。你的代码将更加清洁,并且可以减少奇怪的错误。

+1

哦!有用。 我已经看到这个选项,但我错过了一个支架! 谢谢晁,你救了我的一天! 你是什么意思关于URL的验证? 我想我会保持这个解决方案,只是控制在我的目标页面的顶部,该参数是有效的。你怎么看? – Bertrand

+1

通过验证我的意思是确保ui.item.url有一个值,这是一个有效的URL等,以防万一你在那里得到一些不好的数据。 – Chao