Autocomplete sélection d'un élément en cliquant dans la barre de défilement

Question

J'ai un Probleme avec jquery.ui.autocomplete 1.8 RC2 IE7 ou IE8 avec le CSS suivant (à l'intérieur jquery.ui.autocomplete.css):

.ui-menu { 
     list-style:none; 
     padding: 2px; 
     margin: 0;display:block; 
     height:200px; 
     overflow:scroll; 
     } 

I J'utilise la démo du projet: demos\autocomplete\remote-jsonp.html

Cela fonctionne parfaitement avec firefox mais avec IE7 ou 8, chaque fois que je clique sur la barre de défilement pour voir la fin de la liste, elle sélectionne un élément au lieu de faire défiler vers le bas .

Avez-vous s'il vous plaît une solution pour avoir une hauteur fixe avec jquery.ui.autocomplete et une barre de défilement qui fonctionne avec IE?

Answer 1

J'ai eu le même problème lorsque la barre de défilement a été utilisée pour la saisie semi-automatique. Et lorsque les boutons de la barre de défilement utilisés par l'utilisateur/moi-même étaient utilisés - la liste de saisie semi-automatique était masquée automatiquement. Pour votre information: test était en FF3.5

Alors que la solution rapide, je commentais bind("blur.autocomplete", function(event) ... in jquery.ui.autocomplete.js et que ce soit réglé cette question.

Answer 2

Ce bogue est corrigé dans la version JQuery 1.8.2.

Si vous ne pouvez pas passer à 1.8.2, ce hack a fonctionné pour moi:

$("body").click(function() { 
     HideAutoCompleteHack();     
    }); 

    $(document).keyup(function (e) { 
     if (e.keyCode == 27) { //esc 
      HideAutoCompleteHack(); 
     } 
    }); 

    function HideAutoCompleteHack() { 
     $(".ui-autocomplete").hide(); 
    } 

Answer 3

D'accord j'ai finalement obtenu hier de travail sur IE et Chrome après avoir passé près de 20 heures de personne à ce sujet. Cela a été fait -> sans déliant l'événement flou -> sans migration de jquery vers une nouvelle version 1.4.2 (1.4.3/1.4.4) qui était un risque compte tenu de la taille de mon projet

J'ai fait quelques changements minimes à jquery.ui.autocomplete.js dans ma librairie 1.4.2. Ces modifications ont été copiées à partir de la dernière version de jquery.ui.autocomplete.js. J'ai joint le jquery.ui.autocomplete_modified.zip qui a fonctionné pour moi. Veuillez modifier l'extension .zip en .js après avoir téléchargé le fichier. PS: N'utilisez pas jquery.ui.autocomplete.js de version plus récente directement dans votre ancienne bibliothèque, cela ne fonctionne pas. Il montre quelques balises html «STRONG» avec le contenu déroulant.

Le fichier est joint ici
http://forum.jquery.com/topic/setting-height-on-autocomplete#14737000001747027

Cordialement,
Darshan Shroff
shroffdarshan@gmail.com

Answer 4

utilisation max-height à la place.

.ui-autocomplete { 
    max-height: 250px; overflow-y: auto; overflow-x: hidden; 
} 
* html .ui-autocomplete { 
    height: expression(this.scrollHeight > 250 ? "250px" : "auto"); /* sets max-height for IE */ 
} 

Answer 5

simplement augmenter la largeur des 'ac_results' et il se cacheront le y-débordement

.ac_results ul { 
width: 180px; 
/* 
increase width to hide overflow 
*/ 
list-style-position: outside; 
list-style: none; 
padding: 0; 
margin: 0; 

}