开发者

jquery autocomplete plugin - options list won't close after it's been scrolled - Chrome only

开发者 https://www.devze.com 2023-01-19 15:37 出处:网络
I\'m using the jquery autocomplete plugin (http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/) and it\'s fine in firefox but i\'m having a problem in chrome.The list of options that appe

I'm using the jquery autocomplete plugin (http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/) and it's fine in firefox but i'm having a problem in chrome. The list of options that appears is longer than can be displayed at once so has a scrollbar down the side. Once you have scrolled the list with the scrollbar, the list no longer closes when you click outside of it.

I'm stumped by this - can anyone tell me how i can fix it or even diagnose why it's not closing?

cheers, max

EDIT - this same issue can be seen in the autocomplete demo on this page: http://jquery.bassistance.de/autocomplete/demo/

Both of these cases are with Chrome (6.0.472.62 beta in linux, but also seen in windows).

Case 1 - working normally: Type 'a' in the first input. See the list appear. Move the mouse down to 'Adelphi'. Move the mouse sideways out of the list - "Adelphi" should still be highlighted. Click on a blank part of the page- the list will开发者_JS百科 disappear.

Case 1 - broken: Type 'a' in the first input. See the list appear. Scroll the list down till "Amsterdam" is visible. Move the mouse down to 'Amsterdam' so it becomes highlighted (but don't click on it). Move the mouse sideways out of the list - "Amsterdam" should still be highlighted. Click on a blank part of the page - the list will not disappear. This is the issue i'm encountering.


For one thing, plugin's demo works fine even if I set input size to 50px with Chrome css editor. No horizontal scrolling.
Still, if I had to find workaround, I see the whole array of options.

  1. Truncate result using javascript in formatItem handler: http://docs.jquery.com/Plugins/Autocomplete/autocomplete#url_or_dataoptions
  2. Setting list properties through css: something like body > .ac_results > ul > li {overflow: hidden}
0

精彩评论

暂无评论...
验证码 换一张
取 消