Cliquez sur le lien pour afficher une liste déroulante

Question

Je veux juste afficher un lien "Chat gratuit" lorsque je clique sur le lien. Il doit afficher une liste déroulante avec les options "yes" et "no".

Le lien ne doit pas aller nulle part, seulement lorsque "yes" est sélectionné, il doit rediriger vers une page.

J'ai actuellement le code:

<a href="" id="link" name="link" onClick="yesnolist(1)">Free Chat</a> 

et mon Javascript:

<script type="text/JavaScript"> 
    function yesnolist() 
    { 
    var e = document.getElementById("link"); 
    var strUser1 = e.options[e.selectedIndex].value; 
    if (strUser1 == "1") 
     window.location.href = "http://........."; 

    return strUser1; 
    } 
</script> 

Answer 1

Je ne suis pas sûr que je comprends parfaitement votre question.

Je suppose que vous avez dit lien:

<a href="" id="link" name="link" onClick="yesnolist(1)">Free Chat</a> 

Maintenant, quand quelqu'un clique, vous le voulez créer un menu déroulant? Je ne suis pas sûr si vous voulez dire une liste déroulante juste à côté de l'élément d'ancrage ou remplacer l'élément d'ancrage avec la liste déroulante.

je recommande, à tout moment, en utilisant jQuery javascript pour, mais comme il semble que vous ne l'utilisez pas:

<a href="#yesno" id="link" name="link">Free Chat</a> 
<select id="yesno_id" name="yesno" style="display:none;"> 
    <option value="1">Yes</option> 
    <option value="2">No</option> 
</select> 

Nous n'affichera pas encore la liste déroulante, même quand il est déjà là. Maintenant, nous ajoutons un écouteur à #link et à #yesno_id (notez que le code suivant va juste avant le tag ou devrait être placé dans un écouteur body onload).

<script type="text/javascript"> 
document.getElementById('link').addEventListener('click', function() { 
    var yesno = document.getElementById('yesno_id'); 
    yesno.style.display = 'block'; 
    yesno.addEventListener('change', function() { 
     if (this.value === '1') { 
      window.location.href = "http://........."; 
     } 
     else { 
      this.style.display = 'none'; 
     } 
    }, true); 

}, true); 
</script> 

Je n'ai pas testé du tout et aura très probablement des erreurs (je n'ai pas écrit, même sur un éditeur), mais il devrait vous donner l'idée générale.

Ici, nous utilisons javascript discret: nous n'ajoutons aucune référence à JavaScript sur le code HTML. Nous avons simplement des identifiants et des classes, comme n'importe quel HTML sans JS. Ensuite, nous accédons aux éléments HTML en utilisant JavaScript en dehors de tout cela et nous lions les gestionnaires de clic et de changement d'événement (correspondant à chaque élément).

Si la personne clique sur le lien puis sélectionne Non, elle cachera la liste déroulante, si elle dit oui, elle redirigera vers l'URL que vous avez indiquée. Ce serait bien d'avoir le lien sur l'href de l'ancre et d'annuler la propagation de l'événement. Puis récupérez le href depuis le gestionnaire d'événements yesno_id et redirigez-le. De cette façon, si JS est désactivé, il vous redirige directement vers la page (bien que cela ne soit pas "confirmé").

Answer 2

en fait je ne sais pas ce que vous voulez faire .. mais essayez ci-dessous le code pour votre tâche.

<a href="" id="link" name="link" onClick="yesnolist()">Free Chat</a> 


<script type="text/JavaScript"> 
    function yesnolist() 
    { 
    var e = confirm('are you want to sure...?'); 

    if (e == ture) 
     window.location.href = "http://........."; 
     else 
     return false; 

    } 
</script> 

Cela peut utile pour vous ..

Merci.

Answer 3

Je trouve ce JQuery du plugin l'autre jour que je crois fera exactement ce que vous voulez:

http://thrivingkings.com/apprise/

Voir les exemples sur la page pour savoir comment faire un « oui/non » boîte.

Answer 4

Blockquote page chargement inintial cacher la que div

quand cliquez sur le spectacle div avec un retard 1000

Blockquote

u ll obtenir une goutte vers le bas visiual