2016-04-26 8 views
0

Ich mache eine Anwendung mit der LoL (Liga der Legenden) api.
Momentan habe ich Probleme mit meinen Eingaben. Zuerst habe ich ein inputbox und submitbutton in JavaScript erstellt und etwas Code geschrieben, damit ich es benutzen konnte.HTML und Javascript Colab

var inputbox = document.createElement("input"); 
inputbox.type = "input"; 
document.body.appendChild(inputbox); 

var button = document.createElement("input") 
button.type = "button"; 
button.value = "Press me!"; 
document.body.appendChild(button); 

Danach habe ich diesen Code verwendet, um den Eingabewert zu verwenden.

Meine Frage ist, wie kann ich dies in meine index.html statt meiner js-Datei einfügen. Ich kann kein Formular verwenden, da es wahrscheinlich eine einzelne Seite Anwendung ist.

Vielen Dank im Voraus.

+0

zwischen Tag Setzen Sie den Code! –

+0

Warum nicht einfach den HTML-Code schreiben? Und Sie können den js Code zwischen '' – neilsimp1

Antwort

3
<!DOCTYPE html> 
<html> 
    <head> 
    <title>LoL Thing</title> 
    </head> 

    <body> 
    <input type='input' id='lol-input'></input> 
    <button onclick='do_the_thing();'>Press me!</button> 

    <script> 
     function do_the_thing() { 
     var inputbox = document.querySelector('#lol-input'); 
     LookUpSummonerInformation(inputbox.value); 
     } 
    </script> 
    </body> 
</html> 

Hier ist ein einfaches Beispiel, wie Sie die JS mit HTML mischen würde.

+0

Das scheint wie eine gute Idee, aber wie kann ich meine Skriptdatei (lol. js) wenn das Script-Tag bereits verwendet wird? –

+0

Edit: getestet, und ich könnte immer noch die Datei enthalten. –

1

Ich denke, dass Sie dieses etwas suchen

<html> 
    <head> 
    <script> 
     document.onload = function(){ 
     var inputbox = document.createElement("input"); 
     inputbox.type = "input"; 
     document.body.appendChild(inputbox); 

     var button = document.createElement("input") 
     button.type = "button"; 
     button.value = "Press me!"; 
     button.addEventListener("click", function() { 
      LookUpSummonerInformation(inputbox.value); 
     }); 
     document.body.appendChild(button); 
     } 
    </script> 
    </head> 
    <body> 
    ... 
    </body> 
</html> 
0

Sie können JavaScript-Code immer mit einem <script>-Tag in den Text Ihres HTML-Dokuments einfügen.

ZB:

<html> 
    <head> 
    <!-- Head code here --> 
    </head> 
    <body> 
    <script> 
     // Your JavaScript code goes here 
    </script> 
    <!-- Remaining body code here --> 
    </body> 
<html> 

Alternativ

Sie Javascript in Ihrer Index-Datei verknüpfen auch einen <script>-Tag.

ZB:

<html> 
    <head> 
    <!-- Head code here --> 
    </head> 
    <body> 
    <script src="path_to_your_js_file"></script> 
    <!-- Remaining body code here --> 
    </body> 
<html>