添加了多个外部javascripts到html文件,一个停止工作

时间:2016-04-29 15:58:18

标签: javascript html external

我有以下问题: 我有html文件,名为index.html。然后我有两个外部javascript文件,名为algoritmus.jsvypis_stavkujusich.js

我在index.html的头部添加了两个javascripts,如下所示:



<script src="js/algoritmus.js"> </script>
<script src="js/vypis_stavkujucich.js"> </script>
&#13;
&#13;
&#13;

首先应该在表格中插入一些信息,然后在表格下面插入一些文字。现在我的问题是:当我单独添加这些javascript脚本时,它们工作得很好。当我将它们加在一起时,只有其中的第二个工作!我检查了两次src路径,我把它们都包装在init()函数中,只允许它们在页面完全加载时启动。我自己真的找不到解决方案。我不想将所有代码放在一个js文件中,我想将它们分开以遵循良好的编程习惯。希望你们帮助我,对不起我的英语(我在stackovewflow上的第一篇文章)

index.html

&#13;
&#13;
<!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() {
	var minutyPred=teraz.getMinutes();
	var minutyPo;
	if(minutyPred.length>3) {
		minutyPo='0'+minutyPred;
		return minutyPo;
	}
	else
		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>
&#13;
&#13;
&#13;

algoritmus.js

&#13;
&#13;
function init() {

function Stat(nazov,rank) {
	this.nazov=nazov;
	this.rank=rank;
	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) {
	this.meno=meno+" "+priezvisko;
	this.peniaze=vratNahodneCislo(100);
}

var stavkari=[];

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


}

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

}

function vyberPodanie() {
	podanie=vratNahodneCislo(3);
	if(podanie==1)
		return 1;
	else if(podanie==2)
		return 'X';
	else
		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) {
	var kolkoZapasov=document.getElementById("pocet_zapasov").value;
	pocetZapasov=kolkoZapasov;
	var tabulka=document.getElementById("tabulka_zapasov");
	for(i=1;i<=pocetZapasov;i++) {
		var novyRiadok = document.createElement("tr");
		tabulka.appendChild(novyRiadok);
		var prvaBunka=document.createElement("td");
		var druhaBunka=document.createElement("td");
		var tretiaBunka=document.createElement("td");
		var stvrtaBunka=document.createElement("td");
		var piataBunka=document.createElement("td");
		prvaBunka.innerHTML=i;
		druhaBunka.innerHTML=vratZapas();
		if(prvyStat.favorit) {
			tretiaBunka.innerHTML=kurzyFavorit[vratNahodneCislo(kurzyFavorit.length)];
			piataBunka.innerHTML=kurzyOutsider[vratNahodneCislo(kurzyOutsider.length)]
		}

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

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

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

};

window.onload=init;
&#13;
&#13;
&#13;

vypis_stavkujucich.js

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

window.onload=initialize;
&#13;
&#13;
&#13;

2 个答案:

答案 0 :(得分:1)

正如GrumpyHat所提到的,你可能与文件中的变量名冲突。

如果您将此代码放在一个文件中:

var a = "hello";

此代码在另一个文件中:

var a = "world";

执行代码时,A的值取决于最后执行的文件。要解决此问题,您可以使用包装所有代码 (function() {...})

答案 1 :(得分:0)

你无法绑定你的事件。尝试

package testpaket;

import java.util.Map;

public class Header {

        String name;
        String list;
        int id;
        String header1;


        private Map<String, Lists> header;


        //getters&setters
        public String getHeader() { 
              return this.header1; 
        }
        public void setHeader(String header) { 
            this.header1 = header1; 
        }
        public String getList() { 
              return this.list; 
        }
        public void setList(String list) { 
            this.list = list; 
        }
        public String getName() { 
              return this.name; 
        }
        public void setName(String name) { 
            this.name = name; 
        }
        public int getID() { 
              return this.id; 
        }
        public void setID(int id) { 
            this.id = id; 
        }
}

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

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

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