2016-04-29 9 views
0

Ich habe folgendes Problem: Ich habe HTML-Datei, mit dem Namen index.html. Dann habe ich zwei externe Javascript-Dateien mit den Namen algoritmus.js und vypis_stavkujusich.js.Mehrere externe Javascripts zu HTML-Datei hinzugefügt, eine funktioniert nicht mehr

Ich habe zwei Javascripts in den Kopf index.html, wie folgt aus:

<script src="js/algoritmus.js"> </script> 
 
<script src="js/vypis_stavkujucich.js"> </script>

Zuerst einige Informationen zu Tisch in Körper, der zweite sollte einige Text einfügen Tabelle einfügen sollte. Nun zu meinem Problem: Wenn ich diese Javascript-Skripte separat hinzufüge, funktionieren sie gut. Wenn ich sie addiere, arbeiten nur ZWEITE von ihnen! Ich überprüft zweimal src Pfad, ich habe sie beide in init() -Funktion eingewickelt, die sie nur starten können, wenn die Seite vollständig geladen ist. Ich kann die Lösung selbst nicht finden. Ich möchte nicht den ganzen Code in eine js-Datei schreiben, ich möchte sie trennen, um guten Programmiergewohnheiten zu folgen. Hope u Jungs mir helfen, und sorry für mein Englisch (mein erster Beitrag auf stackovewflow)

index.html 

<!doctype html> 
 

 
<html> 
 

 
<head> 
 

 
<!-- IMPORT JAVASCRIPT AND JQUERY --> 
 

 
<script src="js/algoritmus.js"> </script> 
 
<script src="js/vypis_stavkujucich.js"> </script> 
 

 
<title> Virtuálne hry VirGames </title> 
 

 
<meta charset="utf-8"/> 
 
<meta name="viewport" content="width=device-width, initial-scale=1.0"/> 
 

 
<!-- IMPORT CSS --> 
 

 
<link rel="stylesheet" href="css/reset.css" /> 
 
<link rel="stylesheet" href="css/main.css" /> 
 
<link href='https://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'> 
 

 
</head> 
 

 
<body> 
 

 
<script> 
 
var teraz=new Date(); 
 
var nastavMinuty=function() { 
 
\t var minutyPred=teraz.getMinutes(); 
 
\t var minutyPo; 
 
\t if(minutyPred.length>3) { 
 
\t \t minutyPo='0'+minutyPred; 
 
\t \t return minutyPo; 
 
\t } 
 
\t else 
 
\t \t return minutyPred; 
 
} 
 
document.write("Aktuálny dátum: "+teraz.getDate()+"."+(teraz.getMonth()+1)+"."+teraz.getFullYear()); 
 
document.write("<br> Aktuálny čas: "+teraz.getHours()+":"+nastavMinuty()+":"+teraz.getSeconds()); 
 
</script> 
 

 
<h1 id="main_h"> Virtuálne hry VirGames - s nami vyhráva každý ! </h1> 
 

 
<table id="tabulka_zapasov"> 
 
<tr> 
 
<th> Číslo zápasu </th> 
 
<th> Zápas </th> 
 
<th> 1 </th> 
 
<th> X </th> 
 
<th> 2 </th> 
 
</tr> 
 
</table> 
 

 
<div id="prava_strana"> 
 
Generovať zápasov: <input type="text" id="pocet_zapasov" /> 
 
<input type="submit" value="Generovať!" id="generuj_submit" /> <br /> 
 
Vytvoriť imaginárnych stavkárov: 
 
<input type="text" id="pocet_stavkarov" /> 
 
<input type="submit" value="Vytvoriť" id="vytvorit_submit" /> 
 
<div id="udaje_o_stavkaroch"></div> 
 
<table id="tabulka_stavok"> 
 
<tr> 
 
<th> stavkári podali 1 </th> 
 
<th> stavkári podali X </th> 
 
<th> stavkári podali 2 </th> 
 
<th> celkom € </th> 
 
</tr> 
 
</table> 
 
</div> 
 

 
<div id="vypis_stavkujucich"> 
 

 
<br id="clear-fix" /> 
 

 
</body> 
 

 
</html>

algoritmus.js 

function init() { 
 

 
function Stat(nazov,rank) { 
 
\t this.nazov=nazov; 
 
\t this.rank=rank; 
 
\t this.favorit=false; 
 
} 
 

 
var staty=[]; 
 

 
var brazilia=new Stat("Brazília",9.6); 
 
var anglicko=new Stat("Anglicko",8.2); 
 
var cesko=new Stat("Česko",4.5); 
 
var slovensko=new Stat("Slovensko",2.2); 
 
var polsko=new Stat("Poľsko",4.1); 
 
var ukrajina=new Stat("Ukrajina",4.2); 
 
var spanielsko=new Stat("Španielsko",9.5); 
 
var taliansko=new Stat("Taliansko",8.7); 
 
var madarsko=new Stat("Maďarsko",4.8); 
 
var japonsko=new Stat("Japonsko",5.1); 
 
var mexiko=new Stat("Mexiko",6.6); 
 
var rusko=new Stat("Rusko",5.6); 
 
var chorvatsko=new Stat("Chorvátsko",4.9); 
 
var rumunsko=new Stat("Rumunsko",3.9); 
 
var finsko=new Stat("Fínsko",6.8); 
 
var svedsko=new Stat("Švédsko",6.5); 
 
var island=new Stat("Island",5.9); 
 
var usa=new Stat("USA",7.2); 
 
var kolumbia=new Stat("Kolumbia",5.7); 
 
var venezuela=new Stat("Venezuela",6.2); 
 
var bulharsko=new Stat("Bulharsko",3.1); 
 
var cina=new Stat("Čína",5.5); 
 
staty.push(finsko); 
 
staty.push(svedsko); 
 
staty.push(island); 
 
staty.push(usa); 
 
staty.push(kolumbia); 
 
staty.push(venezuela); 
 
staty.push(bulharsko); 
 
staty.push(cina); 
 
staty.push(madarsko); 
 
staty.push(japonsko); 
 
staty.push(mexiko); 
 
staty.push(rusko); 
 
staty.push(chorvatsko); 
 
staty.push(rumunsko); 
 
staty.push(brazilia); 
 
staty.push(anglicko); 
 
staty.push(cesko); 
 
staty.push(slovensko); 
 
staty.push(polsko); 
 
staty.push(ukrajina); 
 
staty.push(spanielsko); 
 
staty.push(taliansko); 
 

 
var mena=["Gustáv","František","Kadimír","Herbert","Hugo","Bonifác","Jožko","Sergej","Norbert","Kazimír","Branislav","Semir"]; 
 
var priezviska=["Janovský","Papadopulos","NejedzChleba","Krutý","Hlavatý","Ježo","Bujak","Had","Fuk","Metalový","Bulo","Aspirin","Kreken","Kunik","Kukuricudus","Vladis"]; 
 
function Stavkar(meno,priezvisko) { 
 
\t this.meno=meno+" "+priezvisko; 
 
\t this.peniaze=vratNahodneCislo(100); 
 
} 
 

 
var stavkari=[]; 
 

 
function vytvorStavkarov(pocet) { 
 
\t for(i=0;i<pocet;i++) { 
 
\t \t stavkar=new Stavkar(mena[vratNahodneCislo(mena.length)],priezviska[vratNahodneCislo(priezviska.length)]); 
 
\t \t stavkari.push(this.stavkar); 
 
\t } 
 

 

 
} 
 

 
var vytvorit_tlacitko=document.getElementById("vytvorit_submit"); 
 
vytvorit_tlacitko.onclick=function() { 
 
\t var kolkoStavkarov=document.getElementById("pocet_stavkarov").value; 
 
\t vytvorStavkarov(kolkoStavkarov); 
 
\t var udaje_o_stavkaroch=document.getElementById("udaje_o_stavkaroch"); 
 
\t for(i=0;i<kolkoStavkarov;i++) { 
 
\t \t var novyStavkar=document.createElement("p"); 
 
\t \t novyStavkar.innerHTML=stavkari[i].meno+" bude podávať za "+stavkari[i].peniaze+"€ na "+vyberPodanie(); 
 
\t \t udaje_o_stavkaroch.appendChild(novyStavkar); 
 
\t } 
 

 
} 
 

 
function vyberPodanie() { 
 
\t podanie=vratNahodneCislo(3); 
 
\t if(podanie==1) 
 
\t \t return 1; 
 
\t else if(podanie==2) 
 
\t \t return 'X'; 
 
\t else 
 
\t \t return 2; 
 
} 
 

 
vytvorStavkarov(10); 
 

 
var prvyKurz,xKurz,druhyKurz=0; 
 

 
var kurzyX=[2.40,2.60,2.80,3.00,3.20,3.40,3.60,3.80]; 
 
var kurzyFavorit=[1.40,1.45,1.50,1.60,1.70,1.80,1.90]; 
 
var kurzyOutsider=[2.10,2.20,2.25,2.30,2.45,2.50,2.60,2.70,2.80]; 
 

 
var generuj_tlacitko=document.getElementById("generuj_submit"); 
 
generuj_tlacitko.onclick = function generujZapasy(pocetZapasov) { 
 
\t var kolkoZapasov=document.getElementById("pocet_zapasov").value; 
 
\t pocetZapasov=kolkoZapasov; 
 
\t var tabulka=document.getElementById("tabulka_zapasov"); 
 
\t for(i=1;i<=pocetZapasov;i++) { 
 
\t \t var novyRiadok = document.createElement("tr"); 
 
\t \t tabulka.appendChild(novyRiadok); 
 
\t \t var prvaBunka=document.createElement("td"); 
 
\t \t var druhaBunka=document.createElement("td"); 
 
\t \t var tretiaBunka=document.createElement("td"); 
 
\t \t var stvrtaBunka=document.createElement("td"); 
 
\t \t var piataBunka=document.createElement("td"); 
 
\t \t prvaBunka.innerHTML=i; 
 
\t \t druhaBunka.innerHTML=vratZapas(); 
 
\t \t if(prvyStat.favorit) { 
 
\t \t \t tretiaBunka.innerHTML=kurzyFavorit[vratNahodneCislo(kurzyFavorit.length)]; 
 
\t \t \t piataBunka.innerHTML=kurzyOutsider[vratNahodneCislo(kurzyOutsider.length)] 
 
\t \t } 
 

 
\t \t else { 
 
\t \t \t tretiaBunka.innerHTML=kurzyOutsider[vratNahodneCislo(kurzyOutsider.length)]; 
 
\t \t \t piataBunka.innerHTML=kurzyFavorit[vratNahodneCislo(kurzyFavorit.length)] 
 
\t \t } 
 
\t \t stvrtaBunka.innerHTML=kurzyX[vratNahodneCislo(kurzyX.length)]; 
 
\t \t novyRiadok.appendChild(prvaBunka); 
 
\t \t novyRiadok.appendChild(druhaBunka); 
 
\t \t novyRiadok.appendChild(tretiaBunka); 
 
\t \t novyRiadok.appendChild(stvrtaBunka); 
 
\t \t novyRiadok.appendChild(piataBunka); 
 
\t } 
 
} 
 

 
function vratNahodneCislo(poAkeCislo) { 
 
\t var nahodneCislo=Math.floor(Math.random()*poAkeCislo); 
 
\t return nahodneCislo; 
 
} 
 

 
function vratZapas() { 
 
\t var favorit; 
 
\t prvyStat=staty[vratNahodneCislo(staty.length)]; 
 
    druhyStat=staty[vratNahodneCislo(staty.length)]; 
 
\t if(druhyStat==prvyStat) 
 
\t \t druhyStat=staty[vratNahodneCislo(staty.length)].nazov; 
 
\t var zapas=prvyStat.nazov+" vs "+druhyStat.nazov; 
 
\t if(prvyStat.rank>druhyStat.rank) 
 
\t \t prvyStat.favorit=true; 
 
\t else 
 
\t \t druhyStat.favorit=true; 
 
\t return zapas; 
 
} 
 

 
}; 
 

 
window.onload=init;

vypis_stavkujucich.js

function initialize() { 
 
var vypis_s=document.getElementById("vypis_stavkujucich"); 
 
var r=document.createElement("p"); 
 
r.innerHTML="nieco"; 
 
vypis_s.appendChild(r); 
 
}; 
 

 
window.onload=initialize;

+0

Ich würde sagen, es ist ein variabler Namenskonflikt sein könnte. Versuchen Sie, beide Skripte in (function() {....} zu umhüllen. – GrumpyHat

+0

Ich habe zuerst in init() {wrapped; Funktion und zweitens in initialize() {}; Funktion, und lassen Sie beide erst initialisieren, nachdem die Seite vollständig vom Fenster geladen wurde.onload = init; –

+0

Machst du auch 'window.onload = initialize;'? Sie können "window.onload" nur eine Sache zuweisen, also ist die letzte die einzige, die funktioniert. – Barmar

Antwort

1

Wie GrumpyHat erwähnt, haben Sie problably Konflikt mit Variablennamen in Ihren Dateien.

Wenn Sie diesen Code in einer Datei haben:

var a = "hello"; 

Und diesen Code in einer anderen Datei:

var a = "world"; 

Wenn Ihr Code ausgeführt wird, wird der Wert von A davon abhängen, welche Datei ist zuletzt ausgeführt werden. Um dies zu beheben, können Sie Ihren gesamten Code mit (function() {...}) umhüllen.

+0

Ich habe es erneut überprüft, und alle Variablen sind völlig anders benannt –

0

Sie können Ihre Ereignisse nicht so binden. Versuchen Sie

function a() { 
    alert('loaded') 
} 
function b() { 
    alert('loaded2') 
} 
window.onload = a; 
window.onload = b; 

Was Sie sehen, es ist nur die zweite Funktion ausgelöst wird. Sie haben

window.onload = function() { 
    a(); 
    b(); 
} 

Alternativ Hörer verwenden Ereignis verwenden, finden Sie Add two functions to window.onload