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

wczytywanie treści innych plików html do diva (strona)

VPS Starter Arubacloud
0 głosów
1,049 wizyt
pytanie zadane 20 września 2018 w JavaScript przez arczix07 Nowicjusz (220 p.)
edycja 20 września 2018 przez arczix07

witam wszystkich,

 

mam mały problem (może nie mały).

cały wrzuciłem pod adres: http://entrybrand.com/php/demo.html i tyle mi się udało z poradnikami wydedukować. Całość to przeróbka mojego kodu + poradnikowego sposobu z angielskiego forum na ładowanie treści po kliknięciu.

strona demo.html sekcja body (buttony mają dodatkowy css ale nie o to się rozchodzi)

<body>
<div class="div-block">
	  <a href="#page1" class="w-button">page1</a>
	  <a href="#page2" class="w-button">page2</a>
	  <a href="#page3" class="w-button">page3</a>
</div>

  <div id="pageContent"></div>

 

w tym samym katalogu plik load_page .php - pomocniczy stawiam, że wyłapuje.

<?php

if(!$_POST['page']) die("0");

$page = (int)$_POST['page'];

if(file_exists('pages/page_'.$page.'.html'))
echo file_get_contents('pages/page_'.$page.'.html');

else echo 'There is no such page!';
?>

do tego oczywiście script.js

var default_content="";

$(document).ready(function(){
	
	checkURL();
	$('ul li a').click(function (e){

			checkURL(this.hash);

	});
	
	//filling in the default content
	default_content = $('#pageContent').html();
	
	
	setInterval("checkURL()",250);
	
});

var lasturl="";

function checkURL(hash)
{
	if(!hash) hash=window.location.hash;
	
	if(hash != lasturl)
	{
		lasturl=hash;
		
		// FIX - if we've used the history buttons to return to the homepage,
		// fill the pageContent with the default_content
		
		if(hash=="")
		$('#pageContent').html(default_content);
		
		else
		loadPage(hash);
	}
}


function loadPage(url)
{
	url=url.replace('#page','');
	
	$('#loading').css('visibility','visible');
	
	$.ajax({
		type: "POST",
		url: "load_page.php",
		data: 'page='+url,
		dataType: "html",
		success: function(msg){
			
			if(parseInt(msg)!=0)
			{
				$('#pageContent').html(msg);
				$('#loading').css('visibility','hidden');
			}
		}
		
	});

}

 

 

do tego istnieje w folderze plików kolejny folder pod nazwą "pages" gdzie są pliki kolejno page_1.html , page_2.html itp i wczytuje z nich treści do diva w demo.html.

 

MOJE PYTANIA I PROŚBY:

1. Jak zrobić by po starcie strony od razu włączał się page_1.html? (załóżmy, że to by była strona home)

2. Jak z adresu url  ... /demo.html#page1

-usunąć # i najlepiej by adres od razu wyglądał np. nazwa.com/home a po kliknięciu np. na page2 ... nazwa.com/page2

3. jak w tej sytuacji dodać własne nazwy plików zamiast page (coś)?

4. Czy może jest jakiś lepszy, prostszy bądź poprawniejszy sposób, czy jakieś rozwiązanie? Ciężko mi się odnieść do google bo rzadko widać tutoriale z zmianą adresu i wczytywaniem z innego pliku treści.

Chciałbym zrobić taką strukturę tylko dla własnych podstron (nie o nazwie page) i by na wejściu ładowało się np.

entrybrand.com/home

po kliknięciu w button menu entrybrand.com/about

I wszystko bez przeładowań.

Dzięki za wszystkie odpowiedzi!

1 odpowiedź

0 głosów
odpowiedź 21 września 2018 przez pablop76 VIP (123,060 p.)

Link  demo nie działa.

Może skorzystaj z tej wtyczki. Rozwiąże ona prawdopodobnie wszystkie Twoje problemy.

prosta metoda wczytywania treści do pojemnika  load()

Podobne pytania

0 głosów
4 odpowiedzi 1,391 wizyt
pytanie zadane 27 października 2017 w Java przez olgak96 Nowicjusz (200 p.)
+1 głos
1 odpowiedź 178 wizyt
0 głosów
1 odpowiedź 109 wizyt
pytanie zadane 21 lutego 2017 w Java przez Wojo7 Nowicjusz (160 p.)

92,453 zapytań

141,262 odpowiedzi

319,088 komentarzy

61,854 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

Akademia Sekuraka 2024 zapewnia dostęp do minimum 15 szkoleń online z bezpieczeństwa IT oraz dostęp także do materiałów z edycji Sekurak Academy z roku 2023!

Przy zakupie możecie skorzystać z kodu: pasja-akademia - użyjcie go w koszyku, a uzyskacie rabat -30% na bilety w wersji "Standard"! Więcej informacji na temat akademii 2024 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!

...