11522 sujets

JavaScript, DOM et API Web HTML5

Je suis encore bloqué dans la recherche clavier sur une liste déroulante:Comme vous l'avez connue et que dans une liste déroulante, quand on l'ouvre et on tape un caractère du clavier le pointeur se dérige vers la première chaine commençant par cette lettre.ça ne me cause pas de problème mais mon soucis et avec la deuxième , la troisième .. et la nième lettre .En fait quand je tappe cette deuxième lettre le curseur oubli la première tapée et se pointe vers les chaines commençant avec cette lettre. Smiley fache Smiley fache .Bon pour mémoriser toute la chaine jusqu'à que je valide par la touche entrée, j'ai construit ce script qui ne marche pas Smiley lol . c'est pour cela je demande vos aides. Smiley bawling Smiley bawling Smiley bawling .
Merci d'avance.
Code:
<html>
<head>

<script language="JavaScript" type="text/javascript">
 $('#selectbox').change(function(event){
  var selectElmt = document.getElementById("selectbox");
  var textselectionne = selectElmt.options[selectElmt.selectedIndex].text;
  var touche = event.keyCode;
  var nom = String.fromCharCode(touche);
while(nom ==textselectionne)
{
document.getElementById("selectbox").selected=textselectionne;
var touche = event.keyCode;
   var nom1 = String.fromCharCode(touche);
   nom+=nom1;
   nom=nom.concat(nom1);
   var textselectionne1 = selectElmt.options[selectElmt.selectedIndex].text;
    textselectionne=textselectionne.concat(textselectionne1);
 }
}
</script>

<
/head>
<body>
<form name="form">
<select name='selectbox' id='selectbox'>
    <option>maison</option>
    <option>miel</option>
    <option>mariage</option>
    <option>chien</option>
    <option>chemin</option>
    <option>chat</option>
    <option>etoile</option>
</select>
<input type=text name='search'>
<script type="text/javascript">       
ListeCheck();
</script>
 
</form>
</body>
</html>
Il faut préciser la source.

Sinon, tu ne veux pas utiliser JQUERY UI ou autre, en natif HTML tu as <datalist>

<label for="choix_bieres">Indiquez votre bière préférée :</label>
<input list="bieres" type="text" id="choix_bieres">
<datalist id="bieres">
  <option value="Meteor">
  <option value="Pils">
  <option value="Kronenbourg">
  <option value="Grimbergen">
</datalist>
Meilleure solution
De rien,

<datalist> c'est très pratique.

Si tu galère vraiment, je te conseil de faire tes recherches en anglais.. Smiley smile