2016-04-29 172 views
0

我有以下问题: 我有html文件,名为index.html。然后我有两个外部JavaScript文件,名为algoritmus.jsvypis_stavkujusich.js添加了多个外部javascript到html文件,一个停止工作

我加入index.html中的头二种Javascript语言,像这样:

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

首先应该插入一些信息表身上,第二应该插入见下表一些文字。现在到我的问题:当我分别添加这些JavaScript脚本,他们工作得很好。当我把它们加在一起时,只有其中的第二个工作!我检查了两次src路径,我把它们都封装在init()函数中,它们只在页面完全加载时才启动。我自己实在找不到解决方案。我不想把所有的代码放在一个js文件中,我想将它们分开以遵循良好的编程习惯。希望能跟大家会帮助我,对不起我的英语(我的第一篇文章上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

我会说这可能是一个变量命名冲突。尝试在(function(){....})中包装这两个脚本 – GrumpyHat

+0

我首先在init(){}中包装;函数,第二个在initialize(){};函数,并让它们都只在页面被窗口完全加载后才初始化。的onload = init;方法 –

+0

你也在做'window.onload = initialize;'?你只能给'window.onload'分配一个东西,所以最后一个是唯一可行的。 – Barmar

回答

1

正如GrumpyHat提到的,你problably具有在文件中的变量名冲突。

如果你有这样的代码在一个文件中:

var a = "hello"; 

而这种代码在另一个文件:

var a = "world"; 

当你的代码得到执行,A的价值将取决于是什么文件最后执行。为了解决这个问题,你可以用 (function() {...})来包装所有的代码。

+0

我再次检查它,并且所有变量都完全不同 –

0

你不能像这样绑定你的事件。尝试

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

你会看到它只是第二个功能被触发。 你必须使用

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

或者使用事件侦听器,请参阅 Add two functions to window.onload

相关问题