Anzeige

mit .load wieder den alten content laden


#1
Hallo, ich habe eine Frage, ich würde gerne wissen, wie ich mit jQuery .load() wieder meinen alten #content laden kann, hier mein Code:


<!DOCTYPE html>
<html lang="de">
<head>
<link rel="stylesheet" type="text/css" href="style.css" media="screen"/>
<meta charset="UTF-8">
<title>show/hideperonlick</title>
</head>

<body>

<div id="content">

<header>

<section class="wrapper">

<nav>

<div class="lr">
<a href="https://startseite.com">Startseite</a>
<a href="https://tiere.com">Tiere</a>
<a href="https://standorte.com">Standorte</a>
<a href="https://FAQ.com">Hilfe</a>
<a href="https://Kontakt.com">Kontakt</a>
<a href="#" class="logIn">Login</a>
</div>

<div class="logo">
<img src="logo.png" class="logo"/>
</div>



<div class="clear"></div>


<div class="menu">
<div class="bar1"></div>
<div class="bar2"></div>
<div class="bar3"></div>
</div>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>

<script>
$( document ).ready(function(){
$(".buttontest").click(function(){
$('#content').load('mobile/index.html #content');
});
});

</script>

</nav>

<div class="clear"></div>

</section>

</header>

<main>
<section class="wrapper">

<article>

<div class="content-container">

<div class="left">

<div class="img"></div>
</div>

<div class="right">
<div class="text">
<h1></h1>
<p></p>
</div>
<div class="buttons">
<button class="affe-btn">Affe</button>
<button class="loewe-btn">Löwe</button>
<button class="giraffe-btn">Giraffe</button>
<div class="clear"></div>
</div>
<button class="buttontest">Tausch</button>
</div>


</div>


<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script language="javascript" type="text/javascript" src="obj.js"></script>

</article>
<div class="clear"></div>
</section>

</main>
<footer>

<p>Copyright by top concepts GmbH</p>


</footer>


</div>

</body>
</html>

Die HTML Datei im mobile Ordner:


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>$Title$</title>
<link rel="stylesheet" type="text/css" href="mobile.css" media="screen"/>

</head>
<body>
<div id="content">
<header>

<section class="wrapper">

<nav>

<div class="oben">
<div class="logo">
<img src="logo.png" class="logo"/>
</div>

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.0/jquery.min.js"></script>

<script>
$( document ).ready(function(){
$(".buttontest").click(function(){
$('#content').load('Mobil/index.html #content');
});
});

</script>


<div class="kreuz">

<button class="buttontest">Tausch</button>

</div>
</div>
<div class="clear"></div>
</nav>
</section>
</header>

<main>
<section class="wrapper">
<article>

<div class="links">
<a href="https://startseite.com">Startseite</a><br>
<br><a href="https://tiere.com">Tiere</a><br>
<br><a href="https://standorte.com">Standorte</a><br>
<br><a href="https://FAQ.com">Hilfe</a><br>
<br><a href="https://Kontakt.com">Kontakt</a><br>
</div>
<a href="javascript:history.back();">previous</a>
</article>
</section>
</main>

</div>
</body>
</html>

Schonmal vielen Dank, für die Hilfe
 

basti1012

Erfahrenes Mitglied
#2
du meinst wenn du auf den button klickst holst du mit load ja neue Daten.
Jetzt willst du noch mal ein Button klicken um den alten content wieder herstellen?

Wenn dann speicherst du den vorherigen Content in einer Variable . Oder du speicherst den Content in ein anderen Document und holst ihn dann auch wieder mit load
 

basti1012

Erfahrenes Mitglied
#4
Wenn du beim Seitenaufruf den ersten Content in einer variabel speicherst und dann mit deinen load was neues holst , müßtedas theoretisch immer wieder auf ruf bar sein.
Aber um das jetzt genau zu sagen muß ich das mal selber ausprobieren.
Notfals speichert man das im localstorage() dann geht es bestimmt.

Ich teste das gleich mal aus
 
Anzeige
Anzeige