Convertir en bon jQuery ce script js standard

**french-petzouille** · 05/02/2019, 20h58

Bonjour... cherchant à n'afficher au sein d'une liste <select> que les lignes qui répondent aux caractères saisis dans un input... je suis tombé sur un script qui marche bien.

MAIS ... il est en js classique ... et je maitrise pas trop bien tout le sens !

Pourriez m'aider à le convertir en jQuery ?

voila la page complète avec la liste et tout le toutim :

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    <title>Recherche avancée dans un select</title>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">
    
 
    /*_____ script original créé par lddsoft mai 2011 _____*/
    var z = 0;
    var LO = new Array();
        var valeur = new Array();
 
    function init(){
        for(z=0; z<document.getElementById('liste').length; z++){
                        LO[z] = document.getElementById('liste').options[z].text;
                        valeur[z] = document.getElementById('liste').options[z].value;
        }
    }
 
    function liste_complete(){
        document.getElementById('liste').length = 0; // vider la liste
        for(z=0; z<LO.length; z++){
                        document.getElementById('liste').options[z] = new Option(LO[z],valeur[z]);      
        }
    }
 
    function chercher(lettres){
        var LIST = document.getElementById('liste');
        if(lettres == ""){    // si le champ est vide, afficher toutes les options de départ
                        liste_complete();
                        return false;
        }
        var newliste = new Array();
                 var newvalue = new Array();
        var x = -1;
        for(z=0; z<LIST.length; z++){
                        if(LIST.options[z].text.indexOf(lettres)!=-1){
                                        x++;
                                        newliste[x] = LIST.options[z].text;
                                        newvalue[x] = LIST.options[z].value;
                        }
        }
        if(x!=-1){ // si la(les) lettre(s) sont dans une(des) option(s)
                        LIST.length = 0; // vider la liste
                        for(z=0; z<newliste.length; z++){
                          LIST.options[z] = new Option(newliste[z],newvalue[z]);            
                        }
        }else{liste_complete();}
    }
        
  </script>
  </head>
  <body onload="init();">
    <form id="formulaire" action="#" name="formulaire">
      <label for="entree">Rechercher:</label> 
	  <input type="text" id="entree" size="30" onkeyup="chercher(this.value);" />
	  <br /><br />
      <select id="liste"  onchange="liste_complete()">
		<option value="1500">Bruxelles 14H30</option>
		<option value="0800BA">Paris 04H15</option>
		<option value="4000C">Londres 10H15</option>
		<option value="520CV">Madrid 08H45</option>
		<option value="4630M">Amsterdam 14H25</option>
		<option value="1810">Lonjumeau 09H25</option>
		<option value="MP001">Lourdes 19H30</option>
      </select>
    </form>
  </body>
</html>

merci +++

**Doksuri** · 06/02/2019, 08h50

et pourquoi ne pas simplement apprendre le JS standard ?

jQuery est au JS ce que la boite automatique est a la boite de vitesse manuelle (pour les voitures)
=> ceux qui apprennent avec une boite auto ne savent pas conduire une manuelle
==> ceux qui apprennent avec une manuelle savent aussi conduire un boite auto

jQuery n'est qu'un raccourcis des termes JS

je crois qu'avec github.com/nefe/You-Dont-Need-jQuery/ tu devrais pouvoir "traduire" ca

**french-petzouille** · 06/02/2019, 09h07

tu as raison +++... mais mes modestes pages .php ont du jQuery dedans et je souhaitais rester homogène.
Les qq fonctions proposées marchent ... mais je patine à les convertir en jQuery.

Convertir en bon jQuery ce script js standard

jQuery

Vue hybride

Discussions similaires

Partager

Partager