• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

question-closed JavaScript - przekazywanie zmiennej pomiędzy osobnymi plikami

Object Storage Arubacloud
0 głosów
2,280 wizyt
pytanie zadane 28 lipca 2018 w JavaScript przez Rozmarynka Użytkownik (830 p.)
zamknięte 28 lipca 2018 przez Rozmarynka

Witam!

Mam dwa osobne pliki JS'a. Chciałabym przesłać zmienną z jednego pliku do drugiego. Każdy plik JS'a jest podpięty od osobny plik HTML. Czy da się to zrobić?

Ogólny zarys pomysłu:
Przerabiam odcinek JS'a pana Mirosława, w którym tworzymy grę "Szubienica". Chciałam dodać osobną stronę tytułową, na której można byłoby wybrać kategorię i wylosować z niej hasło. Losowanie hasła jest w innym pliku JS'a niż "mechanika" gry. Chciałabym wylosowane hasło przekazać do tego pliku JS, w którym obsługuję już "mechanikę" gry.

Szperając po internecie chciałam to zrealizować poprzez takie coś:

document.getElementById("kategorie").innerHTML ='OK - mamy dla Ciebie haslo - <a href="szubienica.html?haslo">Gotowy?</a>';

Ale nie działa :D Wczytuje aktualnie to, co mam w pliku JS z "mechaniką" gry - czyli metoda przekazywania nie działa. Jakieś pomysły? Porady? Wskazówki? Ewentualnie, jak lepiej rozwiązać ten problem?

Strona z kategoriami i losowanie:
 

<!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	
	<link type="text/css" rel="stylesheet" href="losowanie.css" />
	<script src="losowanie.js"></script>
	
	<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700&amp;subset=latin-ext" rel="stylesheet"> 
	
</head>
<body>

	<div id="pojemnik">
		<div id="plansza">WYBIERZ KATEGORIE</div>
		<div id="kategorie">
			<div class="kat" onclick="losuj(1)">SPORT</div>
			<div class="kat" onclick="losuj(2)">MOTORYZACJA</div>
			<div style="clear:both;"></div>
			<div class="kat" onclick="losuj(3)">ELEKTRONIKA</div>
			<div class="kat" onclick="losuj(4)">MUZYKA</div>
			<div style="clear:both;"></div>
			<div class="kat" onclick="losuj(5)">ZDROWIE</div>
			<div class="kat" onclick="losuj(6)">PROGRAMOWANIE</div>
			<div style="clear:both;"></div>
		</div>
	</div>

</body>
</html>
var haslo = "";
//ustawienie mozliwych hasel w losowaniu w zaleznosci od wybranej kategorii;
//kategoria Sport
var sport = new Array(5);
sport[0]="piłka nożna";
sport[1]="piłka ręczna";
sport[2]="bieganie";
sport[3]="kolarstwo";
sport[4]="tennis";
//kategoria motoryzacja
var moto = new Array(5);
moto[0] = "Harley Davidson";
moto[1] = "General Motors";
moto[2] = "Formuła";
moto[3] = "Tesla";
moto[4] = "wyścig";
//kategoria elektronika
var ele = new Array(5);
ele[0] = "zimny lut";
ele[1] = "Arduino";
ele[2] = "dioda";
ele[3] = "płytka prototypowa";
ele[4] = "oprogramowanie";
//kategoria muzyka
var muzyka = new Array(5);
muzyka[0] = "Agnieszka Chylińska";
muzyka[1] = "Alan Silvestri";
muzyka[2] = "Jan Hammer";
muzyka[3] = "saksofon";
muzyka[4] = "instrumenty klawiszowe";
//kategoria zdrowie
var zdrowie = new Array(5);
zdrowie[0] = "zdrowie odżywianie";
zdrowie[1] = "aktywność fizyczna";
zdrowie[2] = "używki";
zdrowie[3] = "sen";
zdrowie[4] = "stres";
//kategoria programowanie
var pro = new Array(5);
pro[0] = "zintegrowane środowisko programistyczne";
pro[1] = "zmienne";
pro[2] = "wskaźnik";
pro[3] = "tablice";
pro[4] = "programowanie obiektowe";

//losowanie 
function losuj(nr_kat)
{
	switch(nr_kat)
	{
		case 1: haslo=sport[Math.floor(Math.random()*5)]; break;
		case 2: haslo=moto[Math.floor(Math.random()*5)]; break;
		case 3: haslo=ele[Math.floor(Math.random()*5)]; break;
		case 4: haslo=muzyka[Math.floor(Math.random()*5)]; break;
		case 5: haslo=zdrowie[Math.floor(Math.random()*5)]; break;
		case 6: haslo=pro[Math.floor(Math.random()*5)]; break;
		
	}

	haslo = haslo.toUpperCase();
	alert(haslo);
	document.getElementById("plansza").innerHTML ="";
	document.getElementById("kategorie").innerHTML ='OK - mamy dla Ciebie haslo - <a href="szubienica.html?haslo">Gotowy?</a>';
}

 

Główny kontent i "mechanika" gry
 

<!DOCTYPE HTML>
<html lang="pl">
<head>
	<meta charset="utf-8" />
	
	<link type="text/css" rel="stylesheet" href="style.css" />
	<script src="szubienica.js"></script>
	
	<link href="https://fonts.googleapis.com/css?family=Source+Code+Pro:400,700&amp;subset=latin-ext" rel="stylesheet"> 
	
</head>
<body>

	<div id="pojemnik">
		<div id="plansza"></div>
		<div id="szubienica">
			<img src="img/s0.jpg">
		</div>
		<div id="alfabet"></div>
		<div style="clear:both;"></div>
	</div>

</body>
</html>
	var haslo="Bez pracy nie ma kołaczy";
	haslo = haslo.toUpperCase();
	
	var dlugosc = haslo.length;
	var haslo1 = "";
	
	for(i=0;i<dlugosc;i++)
	{
		if(haslo.charAt(i) == " ") haslo1 = haslo1 + " ";
		else haslo1 = haslo1 + "-";
	}
	
	var ile_skuch = 0;

	var yes = new Audio("yes.wav");
	var no = new Audio("no.wav");

	var litery = new Array(35);
		
	litery[0] = "A";
	litery[1] = "Ą";
	litery[2] = "B";
	litery[3] = "C";
	litery[4] = "Ć";
	litery[5] = "D";
	litery[6] = "E";
	litery[7] = "Ę";
	litery[8] = "F";
	litery[9] = "G";
	litery[10] = "H";
	litery[11] = "I";
	litery[12] = "J";
	litery[13] = "K";
	litery[14] = "L";
	litery[15] = "Ł";
	litery[16] = "M";
	litery[17] = "N";
	litery[18] = "Ń";
	litery[19] = "O";
	litery[20] = "Ó";
	litery[21] = "P";
	litery[22] = "Q";
	litery[23] = "R";
	litery[24] = "S";
	litery[25] = "Ś";
	litery[26] = "T";
	litery[27] = "U";
	litery[28] = "V";
	litery[29] = "W";
	litery[30] = "X";
	litery[31] = "Y";
	litery[32] = "Z";
	litery[33] = "Ż";
	litery[34] = "Ź";
	
	window.onload = start;


function zmien_haslo()
{
	document.getElementById("plansza").innerHTML = haslo1;
}

function start()
{
	var tresc_diva = "";
	
	for(i=0; i<=34; i++)
	{
		var element = "lit" + i;
		tresc_diva=tresc_diva + '<div class="litera" id="'+element+'" onclick="sprawdz('+i+')">'+litery[i]+'</div>';
		if((i+1)%7==0) tresc_diva = tresc_diva + '<div style="clear:both;"></div>';
	}
	
	document.getElementById("alfabet").innerHTML = tresc_diva;
	
	zmien_haslo();
}

String.prototype.ustawZnak = function(miejsce, znak)
{
	if(miejsce > this.length-1) return this.toString();
	else return this.substr(0,miejsce) + znak + this.substr(miejsce +1);
}

function sprawdz(nr)
{
	
	//flaga
	var trafiona = false;
	
	for(i=0;i<dlugosc;i++)
	{
		if(haslo.charAt(i) == litery[nr])
		{
			haslo1 = haslo1.ustawZnak(i, litery[nr]);
			trafiona = true;
		}
	}
	
	if(trafiona == true)
	{
		var element = "lit" + nr;
		yes.play();
		
		document.getElementById(element).style.background = "#003300";
		document.getElementById(element).style.color = "#00C000";
		document.getElementById(element).style.border = "3px solid #00C000";
		document.getElementById(element).style.cursor = "default";
		
		zmien_haslo();
	}
	else
	{
		ile_skuch++;
		var element = "lit" + nr;
		no.play();
		
		
		document.getElementById(element).style.background = "#330000";
		document.getElementById(element).style.color = "#C00000";
		document.getElementById(element).style.border = "3px solid #C00000";
		document.getElementById(element).style.cursor = "default";
		document.getElementById(element).setAttribute("onclick", ";");
		
		var obraz = "img/s"+ ile_skuch + ".jpg";
		document.getElementById("szubienica").innerHTML = '<img src="'+obraz+'" alt=""/>';
	}
	
	//wygrana
	if(haslo1 == haslo)
	{
		document.getElementById("alfabet").innerHTML = "Brawo!<br /> Odkryto poprawne hasło<br />" + haslo + '<br /><br /><span class="reset" onclick="location.reload()">JESZCZE RAZ?</span>';
	}
	
	//przegrana
	if(ile_skuch>=9)
	{
		document.getElementById("alfabet").innerHTML = "Niestety, nie udało się!!<br /> Poprawne hasło<br />" + haslo + '<br /><br /><span class="reset" onclick="location.reload()">JESZCZE RAZ?</span>';
	}
	
	
}

 

komentarz zamknięcia: Problem rozwiązany

2 odpowiedzi

+2 głosów
odpowiedź 28 lipca 2018 przez Tomek Sochacki Ekspert (227,510 p.)
wybrane 28 lipca 2018 przez Rozmarynka
 
Najlepsza
const value = 'test'; //pobrane np. jakieś textContent z DOM

// Zapisujemy w pamięci:
localStorage.setItem('cachedValued', value);

// i w innym miejscu:
const val = localStorage.getItem('cachedValue');
val; // "test"

To chyba najłatwiejsze rozwiązanie i najszybsze.

komentarz 28 lipca 2018 przez Rozmarynka Użytkownik (830 p.)
Super! Działa fantastycznie! Dziękuję ślicznie :)
+2 głosów
odpowiedź 28 lipca 2018 przez niezalogowany
localStorage lub sessionStorage
komentarz 28 lipca 2018 przez Rozmarynka Użytkownik (830 p.)
Super! Dziękuję ślicznie za odpowiedź :)

Podobne pytania

0 głosów
0 odpowiedzi 1,191 wizyt
pytanie zadane 6 listopada 2018 w JavaScript przez olejniczakbydgoszcz Początkujący (290 p.)
0 głosów
1 odpowiedź 281 wizyt
pytanie zadane 9 stycznia 2020 w PHP przez franz Gaduła (4,940 p.)
0 głosów
1 odpowiedź 165 wizyt

92,624 zapytań

141,478 odpowiedzi

319,822 komentarzy

62,005 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...