JSfiddle: come creare un progetto di file multi-JS/CSS/HTML?

Question

C'è un modo per creare un serio progetto HTML/CSS/JS con più file HTML, CSS, JS su JSfiddle.net? Se sì, come si fa?

---

io voglio creare un applicazioni mobili di base sulla base di HTML/CSS/JS, circa una dozzina di file HTML/CSS/JS. Mi piacerebbe sviluppare tutto su JSfiddle, il mio preferito Online JavaScript IDE. Ma JSfiddle.net mentre un modo pulito per testare i progetti rimane limitata a:

• 1 file html (personale)
• 1 file CSS (personale)
• 1 JS di file (personale)
• diversi esterna risorse (CSS, librerie JS, dati) che richiedono un altro webhosting.

Il documento ufficiale suggesting Github hosting per 1HTML/1JS/1CSS/someDataFiles non è soddisfacente. Vorrei tutto su JSFiddle e più file nel mio progetto.

Answer 1

Puoi farlo all'interno di un jsFiddle ma ci sono alcune limitazioni e probabilmente non ne sarai soddisfatto.

1. È possibile testare solo 1 modello di più pagine HTML. Ma in caso di framework jQuery Mobile questo sarà sufficiente, in quanto è possibile inserire numerose pagine jQM all'interno di un file 1 html.

   Ad esempio, questo è il mio modello jsFiddle quando aiutare a questo gruppo: http://jsfiddle.net/Gajotres/yWTG2/

2. non puoi usare la forma normale richiedente. Invece dovresti usare ajax per sommare i dati del modulo.

   Nella mia altra risposta si possono trovare soluzioni per forma ajax Sottoporre e come inviare i parametri durante la transizione di pagina: jQuery Mobile: Sending data from one page to the another

   Nel caso in cui si desidera comunicare con un host remoto:

   var ajax = { 
       sendRequest:function(save_data){ 
        $.ajax({url: 'http://localhost/JSONP_Tutorial/json.php', 
         data: save_data, 
         async: true, 
         beforeSend: function() { 
          // This callback function will trigger before data is sent 
          $.mobile.showPageLoadingMsg(true); // This will show ajax spinner 
         }, 
         complete: function() { 
          // This callback function will trigger on data sent/received complete 
          $.mobile.hidePageLoadingMsg(); // This will hide ajax spinner 
         }, 
         success: function (result) { 
          if(result == "true") { 
           $.mobile.changePage("#index", { transition: "slide"}); // In case result is true change page to Index 
          } else { 
           alert('Login unsuccessful, please try again!'); // In case result is false throw an error 
          } 
          // This callback function will trigger on successful action 
         }, 
         error: function (request,error) { 
          // This callback function will trigger on unsuccessful action     
          alert('Network error has occurred please try again!'); 
         } 
        }); 
       } 
   } 
   

3. jsFiddle ha una politica stupida in cui vogliono impedire l'uso di file HTML completi. Stanno cercando di far rispettare questo con stupidi avvisi di errore nella parte del contenuto HTML. Avrai bisogno di qualcosa come il plugin firebug per Firefox o Chrome per rimuovere questa stupidità. O puoi farlo anche con il plugin Grease Monkey.

4. Nel caso in cui si desideri utilizzare il modello HTML completo come in questo esempio: http://jsfiddle.net/Gajotres/yWTG2/, sarà necessario utilizzare il codice javascript nello stato onDomready.

5. Alcune funzionalità non funzioneranno. Come l'evento window.orientationchange.