Maison interface Web js tutoriel Comment utiliser JavaScript pour créer un effet de menu déroulant dynamique

Comment utiliser JavaScript pour créer un effet de menu déroulant dynamique

Sep 26, 2017 am 10:10 AM
javascript js 创建

<!DOCTYPE html><html lang="en"><head>
    <meta charset="UTF-8">
    <title>利用二维数组创建动态下拉菜单</title>
    <script type="text/javascript">
        //定义一个二维数组aCity,用于存储城市名称        
        var aCity=new Array();        
        aCity[0]=new Array();        
        aCity[1]=new Array();        
        aCity[2]=new Array();        
        aCity[3]=new Array();        
        aCity[4]=new Array();        
        aCity[5]=new Array();        //赋值,每个省份的城市存放在用于数组的一行        
        aCity[0][0]="--请选择--";        
        aCity[1][0]="--请选择--";        
        aCity[1][1]="东城区";       
        aCity[1][2]="西城区";        
        aCity[1][3]="朝阳区";        
        aCity[1][4]="海淀区";        
        aCity[1][5]="丰台区";        
        aCity[2][0]="--请选择--";        
        aCity[2][1]="福田区";        
        aCity[2][2]="罗湖区";        
        aCity[2][3]="南山区";        
        aCity[2][4]="宝安区";        
        aCity[2][5]="龙岗区";        
        aCity[2][6]="盐田区";        
        aCity[3][0]="--请选择--";       
         aCity[3][1]="越秀区";        
         aCity[3][2]="东山区";        
         aCity[3][3]="海珠区";        
         aCity[3][4]="荔湾区";        
         aCity[3][5]="天河区";        
         aCity[3][6]="白云区";        
         aCity[4][0]="--请选择--";        
         aCity[4][1]="西湖区";        
         aCity[4][2]="上城区";       
          aCity[4][3]="下城区";        
          aCity[4][4]="江干区";        
          aCity[4][5]="拱墅区";        
          aCity[4][6]="滨江区";        
          aCity[5][0]="--请选择--";        
          aCity[5][1]="新城区";        
          aCity[5][2]="碑林区";        
          aCity[5][3]="莲湖区";        
          aCity[5][4]="雁塔区";        
          aCity[5][5]="灞桥区";        
          aCity[5][6]="长安区";        
          aCity[5][7]="周至县";        
          function ChangeCity(){            
          var i,iProvinceIndex;            
          iProvinceIndex=document.frm.optProvince.selectedIndex;            
          iCityCount=0;            
          while(aCity[iProvinceIndex][iCityCount]!=null)                
          iCityCount++;                //计算选定省份的城市个数                
          document.frm.optCity.length=iCityCount; //改变下拉菜单的选项数                
          for(i = 0;i<=iCityCount-1;i++)  //改变下拉菜单的内容                    
          document.frm.optCity[i]=new Option(aCity[iProvinceIndex][i]);                    
          document.frm.optCity.focus();
        }    </script></head><body onfocus="ChangeCity()">
    <h3>选择省份及城市</h3>
    <form name="frm">
        <p>省份:        <select name="optProvince" size="1" onchange="ChangeCity()">
            <option>--请选择--</option>
            <option>北京市</option>
            <option>深圳市</option>
            <option>广州市</option>
            <option>杭州市</option>
            <option>西安市</option>
        </select>
        </p>
        <p>城市:        
        <select name="optCity" size="1">
            <option>--请选择--</option>
        </select>
        </p>
    </form></body></html>
Copier après la connexion

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Outils d'IA chauds

Undresser.AI Undress

Undresser.AI Undress

Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover

AI Clothes Remover

Outil d'IA en ligne pour supprimer les vêtements des photos.

Undress AI Tool

Undress AI Tool

Images de déshabillage gratuites

Clothoff.io

Clothoff.io

Dissolvant de vêtements AI

AI Hentai Generator

AI Hentai Generator

Générez AI Hentai gratuitement.

Article chaud

R.E.P.O. Crystals d'énergie expliqués et ce qu'ils font (cristal jaune)
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Meilleurs paramètres graphiques
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
R.E.P.O. Comment réparer l'audio si vous n'entendez personne
3 Il y a quelques semaines By 尊渡假赌尊渡假赌尊渡假赌
Où trouver la courte de la grue à atomide atomique
1 Il y a quelques semaines By DDD

Outils chauds

Bloc-notes++7.3.1

Bloc-notes++7.3.1

Éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise

SublimeText3 version chinoise

Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1

Envoyer Studio 13.0.1

Puissant environnement de développement intégré PHP

Dreamweaver CS6

Dreamweaver CS6

Outils de développement Web visuel

SublimeText3 version Mac

SublimeText3 version Mac

Logiciel d'édition de code au niveau de Dieu (SublimeText3)

Comment créer du pixel art dans GIMP Comment créer du pixel art dans GIMP Feb 19, 2024 pm 03:24 PM

Cet article vous intéressera si vous souhaitez utiliser GIMP pour la création de pixel art sous Windows. GIMP est un logiciel d'édition graphique bien connu qui est non seulement gratuit et open source, mais qui aide également les utilisateurs à créer facilement de belles images et de superbes designs. En plus de convenir aussi bien aux concepteurs débutants qu'aux professionnels, GIMP peut également être utilisé pour créer du pixel art, une forme d'art numérique qui utilise les pixels comme seuls éléments de base pour dessiner et créer. Comment créer du pixel art dans GIMP Voici les principales étapes pour créer des images pixel à l'aide de GIMP sur un PC Windows : Téléchargez et installez GIMP, puis lancez l'application. Créez une nouvelle image. Redimensionnez la largeur et la hauteur. Sélectionnez l'outil Crayon. Définissez le type de pinceau sur pixels. installation

Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Recommandé : Excellent projet de détection et de reconnaissance des visages open source JS Apr 03, 2024 am 11:55 AM

La technologie de détection et de reconnaissance des visages est déjà une technologie relativement mature et largement utilisée. Actuellement, le langage d'application Internet le plus utilisé est JS. La mise en œuvre de la détection et de la reconnaissance faciale sur le front-end Web présente des avantages et des inconvénients par rapport à la reconnaissance faciale back-end. Les avantages incluent la réduction de l'interaction réseau et de la reconnaissance en temps réel, ce qui réduit considérablement le temps d'attente des utilisateurs et améliore l'expérience utilisateur. Les inconvénients sont les suivants : il est limité par la taille du modèle et la précision est également limitée ; Comment utiliser js pour implémenter la détection de visage sur le web ? Afin de mettre en œuvre la reconnaissance faciale sur le Web, vous devez être familier avec les langages et technologies de programmation associés, tels que JavaScript, HTML, CSS, WebRTC, etc. Dans le même temps, vous devez également maîtriser les technologies pertinentes de vision par ordinateur et d’intelligence artificielle. Il convient de noter qu'en raison de la conception du côté Web

Comment créer un dossier sur Realme Phone ? Comment créer un dossier sur Realme Phone ? Mar 23, 2024 pm 02:30 PM

Titre : Guide du débutant Realme Phone : Comment créer des dossiers sur Realme Phone ? Dans la société actuelle, les téléphones portables sont devenus un outil indispensable dans la vie des gens. En tant que marque de smartphones populaire, RealMobile est appréciée des utilisateurs pour son système d'exploitation simple et pratique. Lors de l'utilisation des téléphones Realme, de nombreuses personnes peuvent être confrontées au besoin d'organiser des fichiers et des applications sur le téléphone, et la création de dossiers est un moyen efficace. Cet article explique comment créer des dossiers sur les téléphones Realme pour aider les utilisateurs à mieux gérer le contenu de leur téléphone. Non.

Comment créer une famille avec Gree+ Comment créer une famille avec Gree+ Mar 01, 2024 pm 12:40 PM

De nombreux amis ont exprimé leur souhait de savoir comment créer une famille dans le logiciel Gree+. Voici la méthode de fonctionnement pour vous. Amis qui veulent en savoir plus, venez jeter un œil avec moi. Tout d’abord, ouvrez le logiciel Gree+ sur votre téléphone mobile et connectez-vous. Ensuite, dans la barre d'options en bas de la page, cliquez sur l'option « Mon » à l'extrême droite pour accéder à la page du compte personnel. 2. Après être arrivé sur ma page, il y a une option « Créer une famille » sous « Famille ». Après l'avoir trouvée, cliquez dessus pour entrer. 3. Accédez ensuite à la page pour créer une famille, entrez le nom de famille à définir dans la zone de saisie en fonction des invites, puis cliquez sur le bouton « Enregistrer » dans le coin supérieur droit après l'avoir saisi. 4. Enfin, une invite « enregistrement réussi » apparaîtra au bas de la page, indiquant que la famille a été créée avec succès.

Conseils de développement PHP et JS : maîtrisez la méthode de création de graphiques en bougies boursières Conseils de développement PHP et JS : maîtrisez la méthode de création de graphiques en bougies boursières Dec 18, 2023 pm 03:39 PM

Avec le développement rapide de la finance sur Internet, l'investissement en actions est devenu le choix de plus en plus de personnes. Dans le trading d'actions, les graphiques en bougies sont une méthode d'analyse technique couramment utilisée. Ils peuvent montrer l'évolution des cours des actions et aider les investisseurs à prendre des décisions plus précises. Cet article présentera les compétences de développement de PHP et JS, amènera les lecteurs à comprendre comment dessiner des graphiques en bougies boursières et fournira des exemples de code spécifiques. 1. Comprendre les graphiques en bougies boursières Avant de présenter comment dessiner des graphiques en bougies boursières, nous devons d'abord comprendre ce qu'est un graphique en bougies. Les graphiques en chandeliers ont été développés par les Japonais

Comment créer une affiche de contact pour votre iPhone Comment créer une affiche de contact pour votre iPhone Mar 02, 2024 am 11:30 AM

Dans iOS17, Apple a ajouté une fonctionnalité d'affichage de contacts à ses applications Téléphone et Contacts couramment utilisées. Cette fonctionnalité permet aux utilisateurs de définir des affiches personnalisées pour chaque contact, rendant le carnet d'adresses plus visuel et personnel. Les affiches de contact peuvent aider les utilisateurs à identifier et à localiser des contacts spécifiques plus rapidement, améliorant ainsi l'expérience utilisateur. Grâce à cette fonctionnalité, les utilisateurs peuvent ajouter des images ou des logos spécifiques à chaque contact en fonction de leurs préférences et de leurs besoins, ce qui rend l'interface du carnet d'adresses plus vivante. Apple dans iOS17 offre aux utilisateurs d'iPhone une nouvelle façon de s'exprimer et ajoute une affiche de contact personnalisable. La fonction Contact Poster vous permet d'afficher un contenu unique et personnalisé lorsque vous appelez d'autres utilisateurs d'iPhone. toi

Un premier aperçu de Django : créez votre premier projet Django en utilisant la ligne de commande Un premier aperçu de Django : créez votre premier projet Django en utilisant la ligne de commande Feb 19, 2024 am 09:56 AM

Commencez le parcours du projet Django : démarrez à partir de la ligne de commande et créez votre premier projet Django. Django est un framework d'application Web puissant et flexible. Il est basé sur Python et fournit de nombreux outils et fonctions nécessaires au développement d'applications Web. Cet article vous amènera à créer votre premier projet Django à partir de la ligne de commande. Avant de commencer, assurez-vous que Python et Django sont installés. Étape 1 : Créer le répertoire du projet Tout d'abord, ouvrez la fenêtre de ligne de commande et créez un nouveau répertoire

Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Tutoriel JavaScript simple : Comment obtenir le code d'état HTTP Jan 05, 2024 pm 06:08 PM

Tutoriel JavaScript : Comment obtenir le code d'état HTTP, des exemples de code spécifiques sont requis Préface : Dans le développement Web, l'interaction des données avec le serveur est souvent impliquée. Lors de la communication avec le serveur, nous devons souvent obtenir le code d'état HTTP renvoyé pour déterminer si l'opération a réussi et effectuer le traitement correspondant en fonction de différents codes d'état. Cet article vous apprendra comment utiliser JavaScript pour obtenir des codes d'état HTTP et fournira quelques exemples de codes pratiques. Utilisation de XMLHttpRequest

See all articles