Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: JQUERY
Forum PHP.pl > Forum > Po stronie przeglądarki
Tomasz1992
16.02.2012, 23:39:28 
[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <link rel="stylesheet" href="style.css" type="text/css" />
  6. <link rel="stylesheet" href="jquery-ui-1.8.16.custom.css" type="text/css" />
  7. <script type="text/javascript" src="jquery-1.6.2.min.js"></script>
  8. <script type="text/javascript" src="jquery-ui.min.js"></script>
  9. <script type="text/javascript">
  10.  
  11. $(document).ready(function () {
  12.  
  13. function bmi() {
  14.  
  15. 	var kilogramy = $("#masa").slider("value"); 
  16. 	$("#wartosckg").text( kilogramy );  
  17.  
  18. 	var centymetry = $("#wzrost").slider("value"); 
  19. 	$("#wartosccm").text ( centymetry ); 
  20.  
  21. 	var ile = kilogramy/((centymetry/100)*(centymetry/100));   
  22. 	$("#bmi").text (bmi);
  23. }
  24.  
  25. $("#masa").slider({ 
  26. 			animate: true,
  27. 			min: 10, max: 200, value: 50,
  28. 			slide: function() { bmi(); },  
  29. 			change: function() { bmi(); }  
  30. 	});		
  31. $("#wzrost").slider({   
  32. 			animate: true,
  33. 			min: 10, max: 250, value: 170,
  34. 			slide: function() { bmi(); }, 
  35.             change: function() { bmi(); }			
  36. });
  37.  
  38. bmi(); 
  39.  
  40.  
  41. </script>
  42.  
  43. </head>
  44. <body>
  45. <div id="otoczka" style="padding:10px;width:300px">
  46. 	<h1>Kalkulator BMI</h1>
  47. 	<p>Masa ciała: <span id="wartosckg"></span></p>
  48. 	<div id="masa"></div>
  49. 	<p>Wzrost w CM: <span id="wartosccm"></span></p>
  50. 	<div id="wzrost"></div>
  51. 	<p style="font-size:1.3em">BMI: <span id="bmi"></span> </p>
  52. </div>
  53. </body>
  54. </html>
[HTML] pobierz, plaintext


I tutaj mi coś z tą stroną nie działa... może ktoś zobaczy na to fachowym okiem? Mam na aplikacje internetowe zrobić taki program na stronie który obiczy BMI no i wyświetli czy jest prawidłowe. Zrobiłem tyle i nie działa mi to... Powinien być wskaźnik którym będziemy regulować wagę i wzrost...
Pawel_W
16.02.2012, 23:46:37 
[HTML] pobierz, plaintext 
  1. var ile = kilogramy/((centymetry/100)*(centymetry/100));   
  2. 	$("#bmi").text (bmi);
[HTML] pobierz, plaintext


hm? smile.gif
Tomasz1992
16.02.2012, 23:53:50
No to tworzy zmienna i do tej zmiennej przypisuje rownanie masaciala/wzrost^2 ?
Pawel_W
17.02.2012, 00:23:15
tylko dlaczego zmienna nazywa się "ile" a linijkę dalej próbujesz wyświetlić zmienną "bmi" smile.gif
Tomasz1992
17.02.2012, 08:26:59
No już to zmieniałem i to nic nie dawało....
Pawel_W
17.02.2012, 10:02:03
pokaż mi miejsce w którym zamykasz nawiasy od "document ready"

poza tym, definicje funkcji takich jak bmi powinny być raczej poza "document ready"
kaem
17.02.2012, 11:10:05
Ale co to znaczy, że nie działa? Nie każdemu chce się wrzucać skrypt u siebie i testować. Opisz co jest nie tak.
john_doe
7.03.2012, 20:50:41
zrobiłem tak i chodzi 

[HTML] pobierz, plaintext 
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <link rel="stylesheet" href="style.css" type="text/css" />
  6. <link rel="stylesheet" href="jquery-ui-1.8.16.custom.css" type="text/css" />
  7. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
  8. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.18/jquery-ui.min.js"></script>
  9. <script type="text/javascript">
  10.  
  11. 	function bmi() {
  12.  
  13. 		var kilogramy = $("#masa").slider("value"); 
  14. 		$("#wartosckg").text( kilogramy );  
  15.  
  16. 		var centymetry = $("#wzrost").slider("value"); 
  17. 		$("#wartosccm").text ( centymetry ); 
  18.  
  19. 		var ile = kilogramy / ( (centymetry/100) * (centymetry/100) );   
  20. 		$("#bmi").text(ile);
  21. 	} 
  22.  
  23. 	$(document).ready(function () {
  24.  
  25.  
  26. 		$("#masa").slider({ 
  27. 					animate: true,
  28. 					min: 10, max: 200, value: 50,
  29. 					slide: function() { bmi(); },  
  30. 					change: function() { bmi(); }  
  31. 			});		
  32. 		$("#wzrost").slider({   
  33. 					animate: true,
  34. 					min: 10, max: 250, value: 170,
  35. 					slide: function() { bmi(); }, 
  36. 					change: function() { bmi(); }			
  37. 		});
  38.  
  39. 		bmi(); 
  40.  
  41. 	 });
  42.  
  43. </script>
  44.  
  45. </head>
  46. <body>
  47. <div id="otoczka" style="padding:10px;width:300px">
  48. 	<h1>Kalkulator BMI</h1>
  49. 	<p>Masa ciała: <span id="wartosckg"></span></p>
  50. 	<div id="masa"></div>
  51. 	<p>Wzrost w CM: <span id="wartosccm"></span></p>
  52. 	<div id="wzrost"></div>
  53. 	<p style="font-size:1.3em">BMI: <span id="bmi"></span> </p>
  54. </div>
  55. </body>
  56. </html>
[HTML] pobierz, plaintext
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2024 Invision Power Services, Inc.