Comment faire pour créer et modifier une zone de liste déroulante de redirection dans Expression Web

INTRODUCTION

Cet article décrit comment créer et modifier une zone de liste déroulante de redirection dans Microsoft Expression Web.

Plus d'informations

Cet article décrit comment créer et modifier un contrôle de zone de liste déroulante qui utilise JScript pour ouvrir une URL spécifique.

Remarque Cet article utilise JScript personnalisé qui n’est peut-être pas disponible dans tous les navigateurs Web. Pour plus d’informations sur la compatibilité du navigateur, cliquez sur Aide de Microsoft Expression Web dans le menu aide , tapez compatibilité du navigateur dans la zone Rechercher et puis cliquez sur Démarrer la recherche pour afficher les rubriques renvoyées.

Créer la zone de liste déroulante de redirection

Microsoft fournit des exemples de programmation à titre d'illustration uniquement, sans garantie expresse ou implicite. Ceci inclut, mais n'est pas limité à, les garanties implicites de qualité marchande ou d'adéquation à un usage particulier. Cet article suppose que vous êtes familiarisé avec le langage de programmation présenté et les outils utilisés pour créer et déboguer des procédures. Les ingénieurs du support technique Microsoft peuvent aider à expliquer la fonctionnalité d'une procédure particulière. Toutefois, ils ne modifieront pas ces exemples pour fournir des fonctionnalités supplémentaires ou créer des procédures répondant à vos besoins spécifiques.
  1. Lancez Expression Web, puis ouvrez votre site.
  2. Dans le menu fichier , pointez sur
    De Nouveau, cliquez sur page dans le
    Volet Office Nouveau , cliquez sur HTML, puis cliquez sur
    OK.
  3. Dans le menu affichage , pointez sur
    La Page, puis cliquez sur Code.
  4. Insérez l’exemple de code suivant entre le < body > et < /Body > balises sur votre page.
    <h3 align="center">Where Do You Want to Go Today?</h3><center>
    <form>
    <p><select name="section" size="1" language="javascript" onChange="gotoPage(this.selectedIndex);">
    <option selected>Where do you want to go today?</option>
    <option>- - - - - - - - - - - - - - - - -</option>
    <option>Microsoft Home Page</option>
    <option>MSN Home Page</option>
    </select></p>
    </form>
    </center>
    <script language="JavaScript">
    <!--
    function gotoPage(varItem)
    {
    switch(varItem)
    {
    case 0:
    window.parent.self.status="Goes Nowhere";
    break;
    case 1:
    window.parent.self.status="Goes Nowhere";
    break;
    case 2:
    window.location="http://www.microsoft.com";
    break;
    case 3:
    window.location="http://www.msn.com";
    break;
    }
    }
    // -->
    </script>

    Remarque Cet exemple de code utilise la propriété window.location pour charger les nouvelles pages. Si vous utilisez un jeu de cadres, la nouvelle page s’affiche dans le frame en cours. Si vous le souhaitez, vous pouvez utiliser la méthode window.open pour charger la page et ensuite spécifier un cadre de destination. Par exemple, pour afficher la page d’accueil de Microsoft en plein écran, utilisez le code JScript suivant.
    case 2:      window.open("http://www.microsoft.com", target="_top");
    break;

    Remarque Vous pouvez recevoir un message d’erreur ou la page peuvent ne pas s’afficher correctement si vous copiez les exemples directement à partir de cet article, puis de les collez dans Expression Web. Les crochets (<) et (>) peuvent apparaître comme du code HTML. Pour contourner ce problème, collez d’abord l’exemple de code dans un nouveau document dans le bloc-notes. Ensuite, copiez l’exemple de code à partir du document dans le bloc-notes à votre page dans Expression Web. Pour ce faire, procédez comme suit :
    1. Copiez l’exemple de code de l’étape 4.
    2. Démarrez le bloc-notes et ouvrez un document vide.
    3. Dans le menu Edition , cliquez sur
      Coller.
    4. Dans le menu Edition , cliquez sur
      Sélectionnez tous.
    5. Dans le menu Edition , cliquez sur
      Copie.
    6. Dans Expression Web, placez le curseur sur une ligne vide juste sous la balise < body > où vous souhaitez insérer le code JScript.
    7. Dans le menu Edition , cliquez sur
      Coller.
  5. Dans le menu fichier , cliquez sur
    Enregistrer.
  6. Dans la boîte de dialogue Enregistrer sous , spécifiez un nom de fichier et un emplacement où vous souhaitez enregistrer la page, puis cliquez sur
    Enregistrer.
  7. Dans le menu fichier , pointez sur
    Aperçu dans le navigateur, puis cliquez sur le navigateur que vous souhaitez utiliser pour afficher un aperçu de la page.

Ajouter une URL à la zone de liste déroulante de redirection

Pour ajouter une URL à la liste qui s’affiche dans la zone de liste déroulante, vous devez effectuer les actions suivantes :
  • Ajouter une entrée à la liste d’options dans le code HTML.
  • Ajouter une entrée à la section « switch (varItem) » du code JScript.
Par exemple, pour ajouter un élément de liste pour le site Web de Support et de Microsoft Help, procédez comme suit.

Remarque Ces étapes supposent que vous n’avez pas effectué toutes les modifications apportées à l’exemple de code après que l’avoir collé dans Expression Web.
  1. Lancez Expression Web, puis ouvrez la page qui contient la zone de liste déroulante.
  2. Dans le menu affichage , pointez sur
    La Page, puis cliquez sur Code.
  3. Placez le curseur immédiatement après le code HTML suivant sur votre page et appuyez sur ENTRÉE pour créer une nouvelle ligne.
    <option>MSN Home Page</option>
  4. Sur la nouvelle ligne, tapez le code HTML suivant pour ajouter cet élément à la liste.
    <option>Microsoft Help and Support Home Page</option>
  5. Placez le curseur immédiatement après le code JScript suivant dans votre page, puis appuyez sur ENTRÉE pour créer une nouvelle ligne.
    case 3:      window.location="http://www.msn.com";
    break;
  6. Sur la nouvelle ligne, tapez le code JScript suivant pour rediriger l’URL vers le site Web que vous ajoutez.
    case 4:      window.location="http://support.microsoft.com";
    break;

  7. Dans le menu fichier , cliquez sur
    Enregistrer.
  8. Dans le menu fichier , pointez sur
    Aperçu dans le navigateur, puis cliquez sur le navigateur que vous souhaitez utiliser pour afficher un aperçu de la page.

Supprimer une URL de la zone de liste déroulante

Pour supprimer une URL de la liste qui s’affiche dans la zone de liste déroulante, vous devez effectuer les actions suivantes :
  • Supprimer l’entrée de la liste d’options dans le code HTML.
  • Supprimer l’entrée de la section « switch (varItem) » du code JScript.
Par exemple, pour supprimer l’élément de liste pour le site Web de Support et de Microsoft Help, procédez comme suit :
  1. Lancez Expression Web, puis ouvrez la page qui contient la zone de liste déroulante.
  2. Dans le menu affichage , pointez sur
    La Page, puis cliquez sur Code.
  3. Recherchez le code suivant.
    <option>Microsoft Help and Support Home Page</option>
  4. Sélectionnez le code que vous avez localisée à l’étape 3, cliquez sur le code et puis cliquez sur Supprimer.
  5. Recherchez le code suivant.
    case 4:      window.location="http://support.microsoft.com";
    break;
  6. Sélectionnez le code que vous avez localisée à l’étape 5, cliquez sur le code et puis cliquez sur Supprimer.
  7. Dans le menu fichier , cliquez sur
    Enregistrer.
  8. Dans le menu fichier , pointez sur
    Aperçu dans le navigateur, puis cliquez sur le navigateur que vous souhaitez utiliser pour afficher un aperçu de la page.
Propriétés

ID d'article : 928708 - Dernière mise à jour : 17 janv. 2017 - Révision : 1

Commentaires