Dojo Attiva/disattiva nascondi e mostra divs

Question

Ho eseguito alcune ricerche e ho ottenuto molti risultati misti per l'utilizzo di Dojo per attivare i div che mostrano vs hidden.

• Alcuni usano dojo.style che sembra che potrebbe essere stato sostituito da dojo.fx
• Alcuni usano dijit ma quindi non può accedere a un nodo DOM.
• Alcuni fanno uso di show() e hide()
• Alcuni cambiare il CSS

io non riesco a ottenere qualsiasi di loro di lavorare.

Qualcuno può indicarmi un walkthru aggiornato su questo.

---

risolto

usato una combinazione dei seguenti ...

dojo.addOnLoad(function() { 
     dojo.style(dojo.byId('myDiv'), "display", "none"); 
}); 

e per alternare lo

function toggleDivs(){ 
    if( dojo.style(dojo.byId('myDiv'), "display") == "none"){ 
     dojo.style(dojo.byId('myDiv'), "display", "block"); 
     dojo.style(dojo.byId('myDiv2'), "display", "none"); 
    } else { 
     dojo.style(dojo.byId('myDiv'), "display", "none"); 
     dojo.style(dojo.byId('myDiv2'), "display", "block"); 
    } 
} 

Answer 1

Perché non si usa dojo.fx.Toggler?

var toggler = new dojo.fx.Toggler({ 

     node: "basicNode" 

    }); 

    dojo.connect(dijit.byId("showButton"), "onClick", toggler, "show"); 
    dojo.connect(dijit.byId("hideButton"), "onClick", toggler, "hide"); 
}` 

Da dojo reference-guide:

Le funzioni Toggler.show() e Toggler.hide() sia restituire l'oggetto di animazione per l'animazione in gioco. Questo oggetto può essere usato per fermarsi, mettere in pausa, impostare la "percentuale" di animazione corrente e ottenere lo stato dell'animazione.

Answer 2

Per riferimento, in dojo 1.7 e fino la definizione è leggermente diversa (a causa del caricatore AMD). Vedi il terzo esempio in dojo reference guide.

Il codice è fondamentalmente:

require(["dojo/fx/Toggler", "dojo/fx", "dojo/dom", "dojo/on", "dojo/domReady!"], 
function(Toggler, coreFx, dom, on){ 
    var toggler = new Toggler({ 
    node: "toggle-id", 
    showFunc: coreFx.wipeIn, 
    hideFunc: coreFx.wipeOut 
    }); 
    on(dom.byId("hideButton"), "click", function(e){ 
    toggler.hide(); 
    }); 
    on(dom.byId("showButton"), "click", function(e){ 
    toggler.show(); 
    }); 
}); 

dove showFunc e hideFunc sono funzioni di animazione personalizzate che non solo mostra/nascondere il nodo ma anche espandere/chiudere la loro altezza. Si noti che, se mostrare/nascondere un dijit widget levetta id dovrebbe essere il genitore del widget id, ad esempio:

<div id="toggle-id"><div id="textarea-id"></div></div> 

dove textarea-id è l'ID passato come srcNodeRef durante la creazione di un widget dijit, come ComboBox o TextArea , con operatore new (vedi "toggle-id" nell'esempio di codice sopra).