+ Rispondi alla Discussione
Risultati da 1 a 3 di 3

Far apparire una gif durante upload

Ultimo Messaggio di Protone86 il:
  1. #1
    User
    Data Registrazione
    Jan 2010
    Messaggi
    493

    Far apparire una gif durante upload

    Ciao a tutti

    Non ho mai realizzato nulla in Javascript (o in jQuery) e quindi ho qualche problema a realizzare un semplice script che faccia apparire la classica gif di attesa caricamento non appena l'utente clicca sul pulsante di submit.

    Questo è il codice che sono riuscito a scrivere:
    Codice:
    <html>
    
    <head>
    <script src="link-al-sito-di-jquery  jquery-latest.js"></script>
    </head>
    
    
    <body>
    <script>
    $('#pulsante').click(function(){
      $('#img').show();
    }
    </script>
    
    
    <form method='POST' name='modulo' enctype='multipart/form-data'>
    <input type='file' name='immagine'/>
    <input id="pulsante" type="submit" value='Carica'>
    </form>
    
    
    <img src="img / loading.gif" id="img" style="display:none"/ >
    </body>
    </html>
    Come vedete il codice è molto elementare. Dove sbaglio?

    Grazie a tutti per l'aiuto
    Questa sera in tv - Programmazione televisiva di ogni sera

  2. #2
    User
    Data Registrazione
    Feb 2017
    Località
    Pistoia
    Messaggi
    38
    Ciao,
    - A riga 4 non hai ancora messo il link a jQuery, Javascript non può usare librerie se non sono state importate.
    Prima si importano le librerie jQuery, dopo si usano con gli script Javascript.
    - A riga 12 non hai chiuso correttamente l'istruzione JS aggiungi ");" dopo la chiusa parentesi graffa: });
    - Lo script Javascript per funzionare deve essere spostato subito prima della chiusura del body, può applicare le funzionalità agli elementi solo dopo che sono stati creati nella pagina, come lo hai scritto tu invece la funzione viene eseguita prima ancora che gli elementi vengano creati è normale che non funziona.
    - L'attributo SRC del tag IMG contiene degli spazi superflui prima e dopo lo slash, non troverà mai quell'immagine.
    - Lo script non si vedrà mai in azione se richiamato dal click sul tasto SUBMIT perchè quest'ultimo genera automaticamente un refresh della pagina che quindi riporta lo script allo stato iniziale e reimposta l'attributo style="display:none" al tag IMG.

    Quando programmi cerca di usare l'indentazione, questa ti consente di riconoscere più velocemente il codice e vedere le nidificazioni dei tag.
    Ti ho riscritto lo script applicando il JS all'id #form, in questo modo puoi vedere l'immagine cliccando in un punto qualsiasi della form:
    Codice HTML:
    <html>
        <head>
            <script src="https://code.jquery.com/jquery-3.1.1.js"></script>
        </head>
        <body>
            <form id="form" method='POST' name='modulo' enctype='multipart/form-data'>
                <input type='file' name='immagine'/>
                <input id="pulsante" type="submit" value='Carica'>
            </form>
            <img src="img/loading.gif" id="img" style="display:none"/ >
            <script>
                $('#form').click(function(){
                    $('#img').show();
                });
            </script>
        </body>
    </html>
    Ciao.

  3. #3
    User
    Data Registrazione
    Jan 2010
    Messaggi
    493
    Grazie per la risposta, ma il post è di diversi mesi fa e lo script è stato riscritto da zero. Ciao
    Questa sera in tv - Programmazione televisiva di ogni sera

+ Rispondi alla Discussione

^ Permessi di Scrittura

  • Tu non puoi inviare nuove discussioni
  • Tu non puoi inviare risposte
  • Tu non puoi inviare allegati
  • Tu non puoi modificare i tuoi messaggi
  •  
  • Il codice BB è Attivato
  • Le faccine sono Attivato
  • Il codice [IMG] è Attivato
  • Il codice [VIDEO] è Attivato
  • Il codice HTML è Disattivato
  • Trackbacks Attivato
  • Pingback Attivato
  • Refback Attivato

SEO by vBSEO 3.6.0 PL2 ©2011, Crawlability, Inc.