Funzione con "Funzione"

[CjCreations360]

Salve vorrei fare una richiesta un po particolare (sperando e sia realizzabile).
Ho creato un app in html5...ora il mio quesito:
vorrei sapere se tramite una funzione javascript legata ad esempio ad un div con onclick io possa creare una nuova funzione che apre un altro div..
esempio:

<div id="creo" onclick="creo()">creami</div>

la function creo() dovrebbe creare una funzione in cui document.getElementById("divnuovo").style.display="block".
e naturalmente("naturalmente ovvio") rimanere salvata in maniera che alla nuova apertura dell app ritrovare questa nuova funzione in un apposito tasto e richiamarla...una sorta di salvataggio iciamo..
Scusate la mia assurda richiesta e spero possiate aiutarmi!!!

 

[Francesco Monti]

Puoi usare il localStorage

 

[CjCreations360]

Grazie per avermi risposto innanzitutto!
Ho studiato un po in internet il local storage :localstorage(key,value)etc.
Il problema e che non ho capito bene cme inserirlo, deve essere una funzione:<script> function salva() localstorage etc.
o solo <script>localstorage ETC.
poi per creare la sopramenzionata funzione come e ill codice?
localstorage(salva,nome funzione) oppure localstorage(salva(e la funzione critta direttamente qui).
Non so se sono stato chiaro scusami se sono cosi complicato.
NB. sono un un autodidatta e neanche da molto....

 

[Francesco Monti]

Prima di tutto ti consiglierei di avere tutti i tuoi script in un foglio a parte, così da evitare confusione. Comunque basta che li scrivi come sono:

localStorage.setItem("cane","cane");
var cane = localStorage.getItem("cane");

Ps. Scusa per l'esempio poco chiaro del cane ahah

 

[CjCreations360]

scusa la mia ignoranza adesso provo a scriverti una sorta di codice cosi che tu possa correggermi..
<script>
function salva()
{document.getElementById("nomediv").stzle.display="block";}</script>

<script>
function salvataggio(){localstorage.setItem("salvato,salva()";}</script>

<script>
function carica(){localstorage.getItem("salvato";}</script>

nel html:
<div id="casuale1" onclick="salvataggio()">clicca x salvare</div>
<div id="casuale2" onclick="carica()">clicca x caricare</div>

in caso ci sia qualche minima speranza che qualcosa di tutto sto codice vada bene ti anticipo gia la prossima domanda,
se io avessi diversi div e creassi la function salva1 salva2 salva3 etc

poi creassi vari tasti a cui aggiungerei la funzione salvataggio1 salvataggio2 etc in cui ognuno salva il corrispondente div aperto dalla sua funzione....

nel momento del caricamento tramite la function "carica()" i salvataggi si sostituirebbero?
nel senso che oggi salvo il div con salvataggio1 domani uso salvataggio2 e questo sostituirebbe salvataggio1 giusto?(sbagliato di sicuro...)

 

[CjCreations360]

Ciao so che cosi sono poco chiaro ora ti spiego in breve cosa vorrei fare:
ho scritto un libro e lo sto realizzando sotto forma di app le varie pagine sono dei div contenitori al cui interno ci sono gli elementi relativi al contenuto della pagina.
Il menu iniziale e impostato su block mentre i vari contenitori delle pagine sono tutti settati su none nel momento che inizi la lettura il menu va in none ed il div pagina1 va in block poi quando vai alla pagina due la prima va in none e la 2 in block e cosi via via per le varie pagine...ora sei arrivato alla pagina 14 e diciamo che devi portare fuori in "cane" e salvi la pagina, quando torni su e riavvi la app dal menu principale troverai la voce segnalibro, cliccandoci sopra automaticamente il contenitore menu dovrebbe impostarsi su none e quello della pagina 14 su block cosi tu continuerai la lettura da dove ti eri interrotto.
Il sogni poi sarebbe se si potessero fare piu salvataggi tipo che se un tuo amico sta leggendo e lui arriva all pagina 12 salvandola sia tu che lui potete ricaricare la pagina su cui eravate rimasti.
Spero che cosi ti sia un po piu chiara l idea.
Grazie Grazie Grazie

 

[Francesco Monti]

Premetto che non sono un esperto, anzi, di javascript e localStorage però qualcosa posso dirti:
prima di tutto modifica il messaggio dove hai scritto codice con la formattazione giusta (come nella mia prima risposta) e impaginala un pochino meglio. Comunque credo che tu non possa salvare come value del localStorage una funzione, ma dovrai inserire la variabile da salvare al suo interno. In pratica puoi fare che ogni volta che si cambia pagina, la variabile (che chiamerò "segnalibro") viene aggiornata con il nuovo indirizzo, e una volta riaperta l'applicazione, la richiami.

 

[CjCreations360]

Grazie per la pazienza e le risposte, so che non ho scritto in maniera molto pulita ma volevo un po rendere la mia idea, immagginavo che una funzione non potesse essere il valore del localstorage, il fatto e che secondo il tuo discorso mi sorge un piccolo dubbio, non posso aggiornare il nuovo indrizzo perche l applicazione si trova in un unico foglio, praticamente ho solo un index con al suo interno vari div che si sostituiscono a seconda della situazione.
Percio, sempre se si puo fare, dovrei creare diciamo per esempio 20 variabili che impostino il div del menu su display none ed il div relativo alla pagina corrispondente su display block, una per ogni pagina del libro...la voce del menu segnalibro dovrebbe contenere di base una funzione"vuota" che tramite il locastorage venga riempita con la variabile relativa alla pagina in cui ci si trova nel momento che viene impostato il salvataggio,oppure che la funzione del segnalibro contenga gia le 20 variabili(o forse meglio un array? non lo conosco bene ma credo che faccia piu al caso mio) e tramite il localstorage impostare quale variabile debba agire...lo spiegare la meccanica quantistica forse sarebbe piu facile

 

[Francesco Monti]

Secondo me un array potrebbe fare al caso tuo, su cosa hai dubbi? Come lo vorresti sfruttare?

 

[CjCreations360]

innanzitutto non ho studiato gli array perche essendo autodidatta ho affrontato gli argomenti in base alle esigenze o i problemi che mi si ponevano davanti durante lo sviluppo dell applicazione percio di array non ne so un acca, naturalmente non ti chiedo ora di farmi una lezione li studiero cosi imparero ma vorrei capire se cio che ho descritto sopra e fattibile...
io so che nel array puoi mettere varie informazioni insieme tipo una lista di nomi o altro, percio vorrei semplicemente sapere se questa lista possono anche essere dei cambi di stile tramite javascript e che funzionino come ho descritto in precedenza..ovvero che il localstorage imposti il valore corrispondente cosi da richiamarlo nel momento opportuno.

 

[Francesco Monti]

Gli array diciamo che sono "liste" che puoi scorrere con un ciclo for. In teoria potresti far si che quando arrivi ad un determinato punto sulla lista (che puoi dividere in pagine), si attivi una funzione che faccia variare lo stile e far si che quella pagina si salvi in localStorage.

 

[CjCreations360]

Grazie davvero, inizio come dire a vedere un piu piu luce in questo buio tunnel...scherzo!
E se anziche un ciclo for con gli array facessi un semplice( per modo dire ) if..else..in cui ognuno dei if e dei else fossero abbinati ad un nome o valre e che ogni mio div/pagina conterebbe uno di questi valori in maniera tale che il setitem imposti il nome preassegnato nel momento del salvataggio e la funzione legata al caricamento dei dati tramite il getitem si "muova" fino al if o al else col nome corrispondente(lo so lo so..fantascienza)

 

[Francesco Monti]

No potresti fare anche così, anche se la imposterei per esempio:

if(//condizione 1){
  ...
}
else if (//condizione 2){
  ...
}
else if (//condizione 3){
  ...
}
..

e così via. Sinceramente preferisco utilizzare un array (che da imparare è semplice) piuttosto che fare un else if per ogni pagina che hai (che immagino siano molte), però ovviamente scegli tu anche in base al tempo che hai!

 

[CjCreations360]

Innanzitutto sono contento di non viaggiare solo di fantasia e che ce qualche speranza per me...
Da quello che ho letto finora sicuramente una lista di array da un punto di vista di velocit praticita e numero di righe di codice farebbe piu al caso mio, il problema e che quando cerco guide su arra o if else che sia vengono sempre illustrati i classici esempi con form o liste di nomi etc...non credo trovero mai qualcosa che mi chiarisca il mio caso perche e una cosa abbastanza particolare, quelle in cui un "vero" programmatore perde parecchie ore di sonno ad impostarla.
Naturalmente non mi spaventanole notti insonni ma ho bisogno di avere una specie di base di partenza...
So che e chiederti molto ma tu prova ad immagginare di avere ad esempio 10 div impostati tramite il foglio di stile su display:none; ed un div menu con due voci:
-avvia;
-segnalibro;

nl quale avvia avra la funzione onclick in cui il div menu verra modificato in display:none e quello relativo al div 1 in display:block poi dal 1 al 2 stessa e via dicendo...ma questo lo avevo gia illustrato prima...naturalmente se non ti disturba e toglie troppo tempo mi faresti vedere come inseriresti nell array le 10(facciamo 2 dieci mi pare esagerato come favore) funzuioni in cui ognuna avra sempre la prima parte(menu che viene settato su display:none)uguale e la seconda(div 1,2,etc. impostato su display:blocK)diversa per ogni div.
Poi(ma non finisce mai di chieder questo qua...uff)come settare nei vari div il localstorage set item che memorizzerebbe il valore corrispettivo del array e di conseguenza il get item associato alla voce segnalibro che col cilclo arriverebbe fino al valore corrispondente del setitem impostato nel relativo div.
Non ti chiedo di scrivermi un codice di tre pagine in cui fai il lavoro per me, vorrei piu che altro che con un esempio pratico riuscissi a capire in che modo impostare la funzione in cui un div va in none e laltro in block dentro al valore dell array e come associare questo valore al setItem del localstorage e cosa mi occore per far in modo che il getItem del local storage avvi il ciclo per arrivare al punto definito.
Scusa naturalmente puoi ignorarmi perche so che ora ti chiedo cose complicate e che ti faranno perdere molto tempo anzi garzie di tutto finora mi hai illuminato su molte cose e ora almeno so cosa cercare per poter povare a fare esperimenti.

 

[CjCreations360]

Allora non avrai mica pensato che avrei lasciato tutto il divertimento solo a te....
Ho pescato in internet un codice per una semplice funzione (che in questo caso tratta di if ed else) che dovrebbe rendere bene
l idea di quello che intendo.
Ora te la metto giu nel suo modo originale:
<html>
<head>
<script>
<!--
function confronto(form){
if (form.a.value && form.b.value)
{
if (form.a.value==form.b.value)
form.c.value="uguali"
else //se non sono uguali....
form.c.value="diversi"
} //Conclude tutte le azioni
else //
alert("devi inserire i valori")
}
-->
</script>
</head>
<body>
<form name="d" action="#">
<b>A</b> <input size="10" name="a"><br>
<b>B</b> <input size="10" name="b"><br>
<textarea name="c" rows="1" cols="10"></textarea><br>
<input onclick=confronto(this.form); type="button" value="Aziona la funzione confronto"><br>
<input type="reset" value="Reset" name="cancella">
</form>
<body>
</html>
come puoi notare nelle due caselle possono essere inseriti dati qualsiasi, nomi o numeri o lettere, se i valori sono uguali viene il messaggio "uguali" altrimenti se non lo sono compare il messaggio "diversi".

Ora ti ripropongo lo stesso codice con la mia modifica:
<html>
<!DOCTYPE html>
<html>
<head>
<script>
<!--
function confronto(form){
if (form.a.value && form.b.value)
{
if (form.a.value==form.b.value)
form.c.value="uguali"
else
document.getElementById("dietro").style.display="block";
document.getElementById("dietro2").style.display="none";
} //Conclude tutte le azioni
else
alert("devi inserire i valori")
}
-->
</script>
<style>

#dietro{
display:none;
position: absolute;

top:200px;

left:500px;

height20px;

width:20px;

background-color:black;

}
</style>

<style>

#dietro2{
display:block;
position: absolute;

top:200px;

left:600px;

height20px;

width:20px;

background-color:red;

}
</style>

</head>
<body>
<div id="dietro">ciao</div>
<div id="dietro2">ciao</div>

<form name="d" action="#">
<b>A</b> <input size="10" name="a"><br>
<b>B</b> <input size="10" name="b"><br>
<textarea name="c" rows="1" cols="10"></textarea><br>
<input onclick=confronto(this.form); type="button" value="Aziona la funzione confronto"><br>
<input type="reset" value="Reset" name="cancella">
</form>
</body>
</html>

Come potrai notare ho sostituito la frase "diversi" con un doppio cambio di id tramite javascript,
se non metti i valori uguali avremo la scomparsa del div rosso e la comparsa del div nero.
Praticamente vorrei capire se tramite localstorage posso fare una cosa del genere...creare con setitem un valore tipo "uno"
poi nel tasto del segnalibro creare una serie di coppie di valori, zero(il menu)-uno, zero-due, zero-tre, etc...
con if ed else o con un array verra cercata la coppia corrispondente al valore impostato con il setitem e cosi entrera in funzione il getitem che eseguira le modifiche sui due getElementById corrispondenti..
Spero cosi che il tutto sia un po piu chiaro(perche credo prima abbia un po caotizzato la cosa), io continuo a fare esperimenti e ricerche ma se a te viene o conosci gia un modo per imlementare il localstorage con questo tipo di situazione sarebbe veramente il massimo!
Grazie di tutto e Buonanotte!

 

[CjCreations360]

<html>
<head>
<script>
function salvare(){
var salvo="antonio";
localStorage.setItem("salvataggio",salvo);
alert("salvato");}
</script>


<script>
function carica(){
if
(localStorage.getItem("salvataggio"));{
document.getElementById("dietro").style.display="block";
document.getElementById("dietro2").style.display="none";}}
</script>

<style>

#dietro{
display:none;
position: absolute;

top:200px;

left:500px;

height20px;

width:20px;

background-color:black;

}
</style>

<style>

#dietro2{
display:block;
position: absolute;

top:200px;

left:600px;

height20px;

width:20px;

background-color:red;

}
</style>


<style>
#tastosalva{
color:blue;}
</style>

<style>
#tastocarica{
color:blue;}
</style>




</head>
<body>
<div id="tastosalva" onclick="salvare()">salva</div>

<div id="tastocarica" onclick="carica()">carica</div>
<div id="dietro">ciao</div>
<div id="dietro2">ciao</div>





</body>
</html>

Ci sono...cosi ottengo quello che voglio...ricaricando un div va in none e láltro in block....


<html>
<head>
<script>
function salvare(){
var salvo="antonio";
localStorage.setItem("salvataggio",salvo);
alert("salvato");}
</script>
<script>
function salvaredue(){
var salvi="nto";
localStorage.setItem("salvataggiodue",salvi);
alert("salvato2");}
</script>

<script>
function carica(){
if
(localStorage.getItem("salvataggio"));{
document.getElementById("dietro").style.display="block";}

else
(localStorage.getItem("salvataggiodue"));{
document.getElementById("dietro2").style.display="block";}
}
</script>

<style>

#dietro{
display:none;
position: absolute;

top:200px;

left:500px;

height20px;

width:20px;

background-color:black;

}
</style>

<style>

#dietro2{
display:none;
position: absolute;

top:200px;

left:600px;

height20px;

width:20px;

background-color:red;

}
</style>


<style>
#tastosalva{
color:blue;}
</style>
<style>
#tastosalva2{
color:blue;}
</style>
<style>
#tastocarica{
color:blue;}
</style>




</head>
<body>
<div id="tastosalva" onclick="salvare()">salva</div>
<div id="tastosalva" onclick="salvaredue()">salva2</div>
<div id="tastocarica" onclick="carica()">carica</div>
<div id="dietro">ciao</div>
<div id="dietro2">ciao</div>





</body>
</html>

Cosi(usando if, else, gli array ancora li sto studiando)...non funziona..hai per caso idea di cosa io stia sbagliando?

 

[Francesco Monti]

Mi puoi spiegare la condizione dentro le if?

 

[CjCreations360]

Come hai potuto notare dal primo esempio ho creato un tasto salva in cui memorizavo un normalissimo nome, nella funzione carica richiamo con il getItem la chiave settata in precedenza prcio if implica che se il localstorage.getItem richiama la chiave avviene il mutamento dei div.
Nel secondo caso (naturalmente cosi ad esperimento) ho provato ha creare due differenti chiavi di salvataggio e if ed else come condizione richiamavano ognuno un getitem ma con la differente chiave...io speravo che cosi salvando con il tasto uno alla ricarica avveniva il primo evento invece (tecnicamente) sostituendo la chiave di salvataggio con il tasto due (sempre tecnicamente) la funzione carica avrebbe dovuto trovarsi di fronte alla condizione che se getItem = chiave1 faccio A,
oppure getItem = chiave2 faccio B.
Dato pero che con il secondo esempio non funziona affatto ne uno ne l altro penso che il problema potrebbe essere nell impostazione errata del codice, sai qualche parentesi o punto e virgola oppure semplicemente che questo tipo di funzionamento non e realizzabile....sigh!

 

[Francesco Monti]

Ricorda che nell'else non puoi impostare condizioni

if(salvo = localStorage.getItem('salvataggio')){

   document.getElementById("dietro").style.display="b lock";

}
if else (salvi = localStorage.getItem('salvataggiodue')){

   document.getElementById("dietro2").style.display=" block";

}

Prova così

 

[CjCreations360]

ti ringrazio ma pultroppo anche cosi non funziona,
credo che quando il localsorage setta la chiave di salvataggio bisognerebbe trovare il modo che si crei un qualche nome in automatico tipo pagina1, e che lo stesso nome si imposti in automatico nel div contenente la funzione carica cosi con if ed else si confronterebbe con == i due nomi in maniera che arivati all ugualianza scatterebbe il cambio del div, cosi ogni pagina imposterebbe la sua voce, pagina1 pagina2 pagina3 etc. ed ogni volta il salvataggio si sotituisca nel setItem e di conseguenza nel div segnalibro...solo che non ho la minima idea ne se si possa e ne come realizzare una cosa simile..Sigh!Sigh!