Tworzę aplikację internetową, w której nagłówkistopki dla wszystkich stron są takie same. Chcę osiągnąć tylko zmianę części strony między nagłówkiem a stopką po kliknięciu przycisku w nagłówku. Na przykład są 3 przyciski Strona główna, Działania i Obszary. Jeśli kliknę działania, nagłówek i stopka strony powinny pozostać takie same, a strona działań powinna znajdować się między nagłówkiem a stopką. Jak mogę to zrobić?
Odpowiedzi:
13 dla odpowiedzi nr 1Zgadzam się z Rlemonem. Myślę, że jQuery / AJAX jest tym, czego szukasz. Na przykład:
<html>
<head>
<!-- Include Jquery here in a script tag -->
<script type="text/javascript">
$(document).ready(function(){
$("#activities").click(function(){
$("#body").load("activities.html");
});
});
</script>
</head>
<body>
<div id="header">
<a href="#" id="activities">Activities</a>
<!-- this stays the same -->
</div>
<div id="body">
<!-- All content will be loaded here dynamically -->
</div>
<div id="footer">
<!-- this stays the same -->
</div>
</body>
</html>
W tej prostej implementacji właśnie utworzyłem 2 proste strony HTML, index.html zostanie użyty jako szablon. I Activities.html, który zawiera zawartość, którą chcę ładować dynamicznie.
Dlatego jeśli kliknę Działania, powinien załadować do pliku activity.html bez ponownego ładowania całej strony.
Możesz pobrać bibliotekę jquery z jquery.org
Nie testowałem tego, ale powinno działać.
Mam nadzieję, że to pomoże :-)
1 dla odpowiedzi nr 2
Po dostarczeniu strony - nagłówek + treść +Stopka jest scalona. Możesz traktować to jak jedną stronę. Jeśli więc w nagłówku nazywanym elementem w ciele powiesz „Kontener”, to pod warunkiem, że umieścisz go w sekcji treści, będziesz mógł go zmodyfikować.
1 dla odpowiedzi nr 3
Czy używasz PHP lub stron po stronie serwera? Możesz po prostu mieć nagłówki i stopki jako zawarte. Jquery jest naprawdę skomplikowane, ponieważ chcesz umieścić na swojej stronie nagłówki i stopki.
1 dla odpowiedzi nr 4
Szukasz AJAX (akronim od asynchronicznego JavaScript i XML)
w jQuery możesz użyć $ .ajax
tutaj jest przykładem / tutorialem jak to zrobić z php.
1 dla odpowiedzi nr 5
Musisz wysłać żądanie AJAX do serwera. Serwer odpowiedziałby kodem HTML, aby „wstrzyknąć” między nagłówek i stopkę. A hendler oddzwaniania AJAX zastąpiłby obecną zawartość nową.
Wszystko to odbywa się za Ciebie za pomocą skrótu load funkcja z jQuery. Widzieć http://api.jquery.com/load/
1 dla odpowiedzi № 6
utwórz div zawierający treść i dajto unikalna klasa lub identyfikator. Następnie w swoim kodzie jquery powiąż zdarzenie click na elementach, które chcesz użyć jako nawigacji, aw tym powiązaniu użyj $ („# div”). Load („page.php”) lub czegoś podobnego, aby załadować zawartość z innego pliku do div