Maison > Article > interface Web > Comment lier la zone de sélection déroulante js et la zone de saisie pour ajouter la valeur sélectionnée aux compétences input box_javascript
L'exemple de cet article décrit la méthode de liaison de la zone de sélection déroulante js et de la zone de saisie pour ajouter la valeur sélectionnée à la zone de saisie. Partagez-le avec tout le monde pour votre référence. Les détails sont les suivants :
Voici une démonstration du lien entre la zone de sélection déroulante js et la zone de saisie, et l'effet de l'ajout direct de la valeur sélectionnée à la zone de saisie. Je pense que de nombreux amis ont vu cet effet. Cela évite à l'utilisateur les problèmes de saisie. Ici, JS est utilisé pour attribuer directement la valeur à la zone de saisie, après avoir compris le principe, il peut être utilisé de manière flexible pour étendre davantage d'effets spéciaux.
La capture d'écran en cours d'exécution est la suivante :
L'adresse de la démo en ligne est la suivante :
http://demo.jb51.net/js/2015/js-select-value-to-input-codes/
Le code spécifique est le suivant :
<html> <head> <title>下拉选择框与输入框联动,直接添加选中值到输入框</title> </head> <body> <select id="uiSel"> <option value="-1">请选择</option> <option value="until1">unti1</option> <option value="until2">unti2</option> <option value="until3">unti3</option> <option value="until4">unti4</option> <option value="until5">unti5</option> </select> <input type="text" name="" id="show" /> </body> <script type="text/javascript"> document.getElementById('uiSel').onchange=function (){ if(this.options[0].value==-1)this.options[0]=null; document.getElementById('show').value=this.value }; </script> </html>
J'espère que cet article sera utile à la conception de la programmation JavaScript de chacun.