C'est une question théorique à ce moment-là, mais quelque chose que je vais probablement vouloir faire à long terme.
Lorsque vous allez sur Google.com et commencez à taper une recherche, cela vous fournira des suggestions dans un petit menu déroulant. Je suis raisonnablement certain qu'ils utilisent Ajax pour envoyer ce que vous avez saisi et obtenez une liste de suggestions possibles. Ce que j'essaie de comprendre, c'est comment ils affichent cette liste. Il ressemble à une simple liste de dépose
3 Réponses :
Vous pouvez utiliser jQuery autocomplete -
L'idée est que vous tirez un événement JavaScript surKeyup. Cet événement devrait poster une demande AJAX contenant la valeur actuelle de l'entrée que vous écrivez.
à partir de là, le PHP vérifie la base de données pour le mot-clé que vous avez écrit et s'il renvoie les résultats à la JavaScript.
JS vérifie le résultat de la demande AJAX et remplit quelque chose de renvoiant de AJAX dans une sélection absolue positionnée.
La sélection positionnée absolue comporte un événement OnClick qui remplit la valeur cliquée à partir de la sélection de texte que vous écrivez.
Excusez mon anglais, mais j'essaie fort d'expliquer.
Je suppose que ma question n'était pas aussi claire que j'aurais aimé. Le problème ne reçoit pas les données du serveur; Ma question s'est concentrée sur la manière dont les données ont ensuite été affichées à l'utilisateur sous la forme d'une boîte déroulante.
D'accord, vous avez donc eu plusieurs positifs, vous pouvez utiliser une liste déroulante Sélectionner et le dessiner exactement sous le texte saisi de saisie, ce qui est ment pour taper le mot-clé. Off Bien sûr dans CSS, il doit être absolu positionné avec un index Z inférieur à celui de l'entrée pour le texte.
L'autre exemple complexe est que vous dessinez une liste non ordonnée qui est styled comme une liste déroulante. Si vous utilisez celui-ci, vous pouvez par exemple charger des images (icônes) avec la suggestion de texte ordinaire. Pour cet exemple, vous devez positionnez l'UL sous l'entrée pour le texte, créez des effets CSS Hover pour l'IL actuellement sélectionné et créez un événement de clic sur chaque IL, qui remplit l'entrée de texte avec le mot-clé cliqué et masque la liste non commandée.
J'espère que cela explique votre question.
Merci beaucoup, une réponse qui répond très directement à la poussée de ma question. Votre autre réponse n'était pas trop mauvaise non plus, en répondant à la mauvaise question. Très approfondi, très complet, et alors que je n'ai rien fait de tel que cela auparavant, je pense que je pourrais le faire juste de votre explication sans rien regarder autre chose que des références.
Je suis assez tard pour répondre. Mais W3schools a fait un travail merveilleux pour cela.
Just HTML, CSS, Pure JavaScript, rien d'autre. Doit regarder cela. P>
Lien à ceci: W3Schools Auto complet
En cas d'élimination de la liaison, je copie en collant le code ici. p>
p>
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
</head>
<body>
<h2>Autocomplete</h2>
<p>Start typing:</p>
<!--Make sure the form has the autocomplete function switched off:-->
<form autocomplete="off" action="/action_page.php">
<div class="autocomplete" style="width:300px;">
<input id="myInput" type="text" name="myCountry" placeholder="Country">
</div>
<input type="submit">
</form>
</body>
</html>