2010-08-04 7 views
0

Cette paix de code fonctionne pour le premier clic. mais il semble ne pas être en mesure d'obtenir une nouvelle identification du prochain clic. l'idée derrière est de montrer un morceau d'un formulaire et avec un clic sur un bouton il se cache d'abord et montre la deuxième partie. une idée de ce que je fais mal? Je suppose que cela a quelque chose à voir avec "ceci", mais d'après ce que j'ai compris, il devrait aussi avoir l'identifiant du second lien.Mootools Click Evénement Problème

 window.addEvent('domready', function() 
      { 
      $('page_2').slide('hide'); 
      $('page_3').slide('hide'); 
      $('page_4').slide('hide'); 
      $('page_5').slide('hide'); 
      var togglePrefix = 'toggle_', boxPrefix = 'page_', emptyPrefix = ''; 
      var links = $('submit_box').getElements('a'); 
      links.addEvent('click', function(e) 
       { 
       e.stop(); 
       var id = $(this.get('id').replace(togglePrefix,emptyPrefix)); 
       var id_new = parseInt($(this).get('id').replace(togglePrefix, emptyPrefix)) + 1; 
       var next = ('page_'+id_new); 
       var id_old = $(this.get('id').replace(togglePrefix,boxPrefix)); 
       $(id_old).set('slide', {duration: 'long', transition: 'linear'}); 
       $(id_old).slide('out'); 
       $(next).slide('in'); 
       }); 
      }); 

le code html suit ce modèle:

<div id="page_1"> 

    <div id="inhalt-gewinn"> 
     <div id="gewinn_bild"></div> 
     <div id="gewinn_form"> 
      <form id="gewinnspiel" name="gewinnspiel" method="post" action="<?=$_SERVER[PHP_SELF]; ?>"> 
       <div id="input_box"> 
        <div><input type="radio" name="frage1" value="Kamille" /><span>Kamille</span></div> 
        <div><input type="radio" name="frage1" value="Kaktus" /><span>Kaktus</span></div> 
        <div><input type="radio" name="frage1" value="Krokus" /><span>Krokus</span></div> 

       </div> 
       <div id="submit_box"><a id="toggle_1" class="frage">nächste Frage...</a></div> 

     </div> 
     <div id="gewinn_werbung"></div> 
    </div> 
</div> 

Répondre

1

Si je comprends l'exemple, vous avez un tas de divs avec id page_1, page_2 et ainsi de suite. Dans chaque div est un div avec l'identifiant "submit_box". Lorsque vous avez écrit $('submit_box').getElements('a'), il ajoute l'événement uniquement à la première div car un ID doit être unique. Vous ne pouvez pas avoir plus d'un élément avec un identifiant unique dans la page. Donc, pour que votre exemple fonctionne, changez l'identifiant en nom de classe et utilisez $$ ('div.submit_box a').

0

L'utilisation de ID's plusieurs fois sur la page ruinées le code! Après avoir corrigé cela, cela a bien fonctionné

+0

Il doit y avoir une meilleure façon d'écrire ceci. S'il vous plaît faire un jsfiddle (jsfiddle.net) et peut-être quelqu'un peut vous aider à vous orienter correctement. –