|
|
 | Auto refresh div uden Ajax?
Fra : Ace |
Dato : 09-07-08 09:49 |
|
Hejsa
For noget tid siden stillede jeg spørgsmålet i denne
nyhedsgruppe, hvordan man opdaterer indholdet af et div-layer,
hvor det eneste svar jeg fik var "med Ajax".
Jeg fandt herefter ud af, det kan se ud således:
<html>
<body>
<script>
function Ajax(){
var xmlHttp;
try{xmlHttp=new XMLHttpRequest();} // Firefox, Opera 8.0+, Safari
catch (e){
try{xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");} // Internet
Explorer
catch (e){
try{xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");}
catch (e){
alert("No AJAX!?");
return false;}}}
xmlHttp.onreadystatechange=function(){
if(xmlHttp.readyState==4){
document.getElementById('refresh').innerHTML=xmlHttp.responseText
;
setTimeout('Ajax()',1000);}}
xmlHttp.open("GET"," http://www.example.com/",true);
xmlHttp.send(null);}
window.onload=function(){
setTimeout('Ajax()',1000);}
</script>
<div id="refresh"></div>
<iframe src=" http://www.example.com/" style="width:0px;
height:0px;" frameborder="0"></iframe>
</body>
</html>
Ajax-scriptet virker som det skal, men problemet med dette er
imidlertid bare, at scriptet ikke skal indsætte indholdet fra en
url, men udelukkende refreshe div'en, idet den indeholder et php
grab-script.
jeg har derfor forsøgt mig med adskillige javascripts fundet i
diverse fora, som eftersigende skulle kunne klare tricket... men
forgæves :'(
Her er to af de omtalte scripts.
JS-script #1:
<script type='text/javascript'>
window.load = function() {
window.onload = load;
var counter = 0;
window.setInterval(function() {
document.getElementById('refresh').innerHTML =
(counter++).toString();
}, 1000);};
</script>
JS-script #2:
<script type="text/javascript">
function refreshDiv(){
document.getElementById('refresh').innerHTML=document.getElementB
yId('refresh').innerHTML;
setTimeout("refreshDiv()",1000);}
setTimeout("refreshDiv()",1000);
</script>
Disse to, og de andre jeg har prøvet at gøre brug af, har
overhovedet i´kke nogen effekt... hvordan kan det være?
Er der nogen der kan vise mig et script-eksempel på hvordan man
kan refreshe et div-layer uden at være nødsaget til at indsætte
eksternt indhold?
Venligst
Ace
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
 Martin (09-07-2008)
| Kommentar
Fra : Martin |
Dato : 09-07-08 10:47 |
|
Ace wrote:
> Hejsa
>
> For noget tid siden stillede jeg spørgsmålet i denne
> nyhedsgruppe, hvordan man opdaterer indholdet af et div-layer,
> hvor det eneste svar jeg fik var "med Ajax".
<script type="text/javascript" src="jquery-1.2.6.min.js"></script>
<script type="text/javascript">
$(function() {
updateLayer();
})
function updateLayer() {
// Ændrer disse 3
url = 'dinside.php';
updateTimer = 30; // Update hvert 30. sekund
div = 'test' // ID på dit div element
// Stop ændrer
$.get(url,
function(data) {
$('#'+div).html(data);
setTimeout('updateLayer()', updateTimer*1000);
},
);
}
</script>
Ændre de 3 variabler, derefter henter du
< http://code.google.com/p/jqueryjs/downloads/detail?name=jquery-1.2.6.min.js>
og lige retter stien i den første <script...> hvis du ikke ligger den
samme sted som din html fil
| |
Ace (09-07-2008)
| Kommentar
Fra : Ace |
Dato : 09-07-08 15:05 |
|
Martin skrev:
> <script type="text/javascript" src="jquery-1.2.6.min.js"></script>
> <script type="text/javascript">
>
> $(function() {
> updateLayer();
> })
>
> function updateLayer() {
> // Ændrer disse 3
> url = 'dinside.php';
> updateTimer = 30; // Update hvert 30. sekund
> div = 'test' // ID på dit div element
> // Stop ændrer
> $.get(url,
> function(data) {
> $('#'+div).html(data);
> setTimeout('updateLayer()', updateTimer*1000);
> },
> );
> }
> </script>
Tak Martin for dit forslag, men jeg kommer stadig ikke uden om dét, at både det
Ajax-script som jeg viste i den første post, og dit script kræver at indholdet i
div'en skrives igennem scriptet, og det vil jeg helst undgå og altså bare gerne
have div'en refreshet hvert sekund. Har du et forslag til hvordan dette kan
gøres?
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
 Christian Kragh (09-07-2008)
| Kommentar
Fra : Christian Kragh |
Dato : 09-07-08 21:11 |
|
> Tak Martin for dit forslag, men jeg kommer stadig ikke uden om dét, at både det
> Ajax-script som jeg viste i den første post, og dit script kræver at indholdet i
> div'en skrives igennem scriptet, og det vil jeg helst undgå og altså bare gerne
> have div'en refreshet hvert sekund. Har du et forslag til hvordan dette kan
> gøres?
Hej.
Prøv at se mit fotoalbum, adresse http://sp.christiankragh.dk/qfoto, som bruger
jQuery til at hente indholdet dynamisk.
Det eneste den gør er at den sætter indholdet i et element, vilkårligt så det kan
også være et <P>, et img eller hvad det nu skal være du søger.
Hent indhold med følgende kode:
<script type="text/javascript">
$(document).ready(
function()
{
$("#menu").load(" http://sp.christiankragh.dk/qfoto/folder.asp");
}
);
</script>
Den skriver indholdet af http://sp.christiankragh.dk/qfoto/folder.asp til
elementet #menu.
Et andet sted jeg bruger det er med denne linje:
$("#content").load(" http://sp.christiankragh.dk/qfoto/intro.txt");
Christian
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Birger (09-07-2008)
| Kommentar
Fra : Birger |
Dato : 09-07-08 17:10 |
|
"Ace" <ace@clubace.dk> skrev i en meddelelse
news:48747b95$0$90270$14726298@news.sunsite.dk...
> Hejsa
>
> For noget tid siden stillede jeg spørgsmålet i denne
> nyhedsgruppe, hvordan man opdaterer indholdet af et div-layer,
> hvor det eneste svar jeg fik var "med Ajax".
>
> Jeg fandt herefter ud af, det kan se ud således:
> <html>
> <body>
> <script>
> function Ajax(){
> var xmlHttp;
> try{xmlHttp=new XMLHttpRequest();} // Firefox, Opera 8.0+, Safari
> catch (e){
> try{xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");} // Internet
> Explorer
> catch (e){
> try{xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");}
> catch (e){
> alert("No AJAX!?");
> return false;}}}
> xmlHttp.onreadystatechange=function(){
> if(xmlHttp.readyState==4){
> document.getElementById('refresh').innerHTML=xmlHttp.responseText
> ;
> setTimeout('Ajax()',1000);}}
> xmlHttp.open("GET"," http://www.example.com/",true);
> xmlHttp.send(null);}
> window.onload=function(){
> setTimeout('Ajax()',1000);}
> </script>
>
> <div id="refresh"></div>
> <iframe src=" http://www.example.com/" style="width:0px;
> height:0px;" frameborder="0"></iframe>
> </body>
> </html>
>
> Ajax-scriptet virker som det skal, men problemet med dette er
> imidlertid bare, at scriptet ikke skal indsætte indholdet fra en
> url, men udelukkende refreshe div'en, idet den indeholder et php
> grab-script.
>
> jeg har derfor forsøgt mig med adskillige javascripts fundet i
> diverse fora, som eftersigende skulle kunne klare tricket... men
> forgæves :'(
> Her er to af de omtalte scripts.
>
> JS-script #1:
> <script type='text/javascript'>
> window.load = function() {
> window.onload = load;
> var counter = 0;
> window.setInterval(function() {
> document.getElementById('refresh').innerHTML =
> (counter++).toString();
> }, 1000);};
> </script>
>
> JS-script #2:
> <script type="text/javascript">
> function refreshDiv(){
> document.getElementById('refresh').innerHTML=document.getElementB
> yId('refresh').innerHTML;
> setTimeout("refreshDiv()",1000);}
> setTimeout("refreshDiv()",1000);
> </script>
>
> Disse to, og de andre jeg har prøvet at gøre brug af, har
> overhovedet i´kke nogen effekt... hvordan kan det være?
>
> Er der nogen der kan vise mig et script-eksempel på hvordan man
> kan refreshe et div-layer uden at være nødsaget til at indsætte
> eksternt indhold?
>
Sort snak.
En <div> indeholder tekst eller andre HTML elementer. Det kan ikke indeholde
noget PHP.
HTML er statisk. Når du først har loadet siden, kan du ikke ændre noget,
eller få HTML til at "gøre noget".
Det kan man med scripts. (I gamle dage kaldte man det så for DHTML -
Dynamisk HTML).
Det er ikke specielt indlysende hvad det er du ønsker at gøre.
Dit Ajax forsøg henter indhold fra en URL (kunne være et PHP script), mens
det ene JS forsøg blot tæller (sekunder, så vidt jeg kan se), og det andet
ingenting gør (ud over at sætte indholdet af et "refresh" element, til det,
det allerede er).
Så måske, hvis du forklarer hvad det er, du vil opnå...?
Birger
-----
http://bbsorensen.dk
http://varmeretter.dk - hverdagsmad. Sundt, nemt, hurtigt og billigt. Daglig
opdatering.
| |
Ace (10-07-2008)
| Kommentar
Fra : Ace |
Dato : 10-07-08 13:21 |
|
Birger skrev:
> Sort snak.
> En <div> indeholder tekst eller andre HTML elementer. Det kan ikke indeholde
> noget PHP.
> HTML er statisk. Når du først har loadet siden, kan du ikke ændre noget,
> eller få HTML til at "gøre noget".
> Det kan man med scripts. (I gamle dage kaldte man det så for DHTML -
> Dynamisk HTML).
>
> Det er ikke specielt indlysende hvad det er du ønsker at gøre.
> Dit Ajax forsøg henter indhold fra en URL (kunne være et PHP script), mens
> det ene JS forsøg blot tæller (sekunder, så vidt jeg kan se), og det andet
> ingenting gør (ud over at sætte indholdet af et "refresh" element, til det,
> det allerede er).
>
> Så måske, hvis du forklarer hvad det er, du vil opnå...?
Ja jeg frygtede godt nok, at det måske var noget uforståeligt, hvad det er jeg
forsøger at opnå.
Det jeg er igang med, er et lille chat-projekt. Jeg har et div-layer hvori jeg
vil vise chat-beskederne, som kommer fra et andet php-dokument. I div'en har jeg
som sagt således et php-script som henter (grabber) og viser indholdet fra dette
php-dokument. Fordi jeg har en customized scroll-funktion i denne div, er et
iframe ikke hensigtsmæssigt, eftersom højden på iframet jo ikke forøges i takt
med antallet af beskeder (li'som en div gør). Nu er det selvfølgelig muligt at
gøre brug af Ajax-scriptet, som oven i købet placerer indholdet fra
php-dokumentet i div'en, men her har jeg desværre måtte se i øjnene at dette
ikke dur, eftersom chat-beskederne i såfald skrives igennem Ajax-scriptet og
altså ikke hentes og indsættes direkte i div'en, ligesom php-scriptet gør, og
derved udebliver scroll-funktionen åbenbart. Jeg er derfor nødt til at finde en
måde hvorpå jeg udelukkende kan opdatere div'en og php-scriptet så
chat-beskederne fremkommer ligeså snart de sendes.
Sådan her ser det ud:
<div id="scrollholder" class="scrollholder">
<div id="scroll" class="scroll">
<?php
$GrabURL = " http://clubace.dk/chatView.php";
$GrabStart = "/script>";
$GrabEnd = "</html";
$file = fopen("$GrabURL", "r");
$rf = fread($file, 20000);
$grab = eregi("$GrabStart(.*)$GrabEnd", $rf, $printing);
$printing[1] = str_replace("replacedatestamp", "withnewstamp", $printing[1]);
fclose($file);
echo $printing[1];?>
</div></div>
Som det kan ses er det div'en "scroll" jeg gerne vil have opdateret hvert
sekund, ligesom indholdet af php-dokumentet "chatView" bliver, for at vise
chat-beskederne i realtime.
Håber dette var lettere forståeligt, og at nogen kan hjælpe mig.
--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials
| |
Martin (10-07-2008)
| Kommentar
Fra : Martin |
Dato : 10-07-08 13:39 |
|
Ace wrote:
> Håber dette var lettere forståeligt, og at nogen kan hjælpe mig.
>
Når man skal opdater noget, hvor brugeren IKKE skal trykke på et eller
andet, så er det KUN javascript/ajax der kan gøre dette - hvis brugeren
lige skal trykke på en knap, link, eller bare trykke med musen eller et
eller andet aktivt, så kan det lade sig gøre...
Håber dette er til at forstå
| |
Birger (10-07-2008)
| Kommentar
Fra : Birger |
Dato : 10-07-08 17:52 |
|
"Ace" <ace@clubace.dk> skrev i en meddelelse
news:4875fea1$0$90270$14726298@news.sunsite.dk...
> Birger skrev:
>
>> Sort snak.
>> En <div> indeholder tekst eller andre HTML elementer. Det kan ikke
>> indeholde
>> noget PHP.
>> HTML er statisk. Når du først har loadet siden, kan du ikke ændre noget,
>> eller få HTML til at "gøre noget".
>> Det kan man med scripts. (I gamle dage kaldte man det så for DHTML -
>> Dynamisk HTML).
>>
>> Det er ikke specielt indlysende hvad det er du ønsker at gøre.
>> Dit Ajax forsøg henter indhold fra en URL (kunne være et PHP script),
>> mens
>> det ene JS forsøg blot tæller (sekunder, så vidt jeg kan se), og det
>> andet
>> ingenting gør (ud over at sætte indholdet af et "refresh" element, til
>> det,
>> det allerede er).
>>
>> Så måske, hvis du forklarer hvad det er, du vil opnå...?
>
> Ja jeg frygtede godt nok, at det måske var noget uforståeligt, hvad det er
> jeg
> forsøger at opnå.
>
> Det jeg er igang med, er et lille chat-projekt. Jeg har et div-layer hvori
> jeg
> vil vise chat-beskederne, som kommer fra et andet php-dokument. I div'en
> har jeg
> som sagt således et php-script som henter (grabber) og viser indholdet fra
> dette
> php-dokument. Fordi jeg har en customized scroll-funktion i denne div, er
> et
> iframe ikke hensigtsmæssigt, eftersom højden på iframet jo ikke forøges i
> takt
> med antallet af beskeder (li'som en div gør). Nu er det selvfølgelig
> muligt at
> gøre brug af Ajax-scriptet, som oven i købet placerer indholdet fra
> php-dokumentet i div'en, men her har jeg desværre måtte se i øjnene at
> dette
> ikke dur, eftersom chat-beskederne i såfald skrives igennem Ajax-scriptet
> og
> altså ikke hentes og indsættes direkte i div'en, ligesom php-scriptet gør,
> og
> derved udebliver scroll-funktionen åbenbart. Jeg er derfor nødt til at
> finde en
> måde hvorpå jeg udelukkende kan opdatere div'en og php-scriptet så
> chat-beskederne fremkommer ligeså snart de sendes.
>
> Sådan her ser det ud:
>
> <div id="scrollholder" class="scrollholder">
> <div id="scroll" class="scroll">
> <?php
> $GrabURL = " http://clubace.dk/chatView.php";
> $GrabStart = "/script>";
> $GrabEnd = "</html";
> $file = fopen("$GrabURL", "r");
> $rf = fread($file, 20000);
> $grab = eregi("$GrabStart(.*)$GrabEnd", $rf, $printing);
> $printing[1] = str_replace("replacedatestamp", "withnewstamp",
> $printing[1]);
> fclose($file);
> echo $printing[1];?>
> </div></div>
>
> Som det kan ses er det div'en "scroll" jeg gerne vil have opdateret hvert
> sekund, ligesom indholdet af php-dokumentet "chatView" bliver, for at vise
> chat-beskederne i realtime.
>
> Håber dette var lettere forståeligt, og at nogen kan hjælpe mig.
>
Lidt mere forståeligt ;>)
Du kan ikke gøre som du gerne vil.
Indholdet af din div, er ikke dit php script, men det output der kommer fra
scriptet. (Se evt med vis kilde).
Du kan gøre det, at du tage php script-delen fra ovenstående, og lægger den
som en fil for sig - f.eks. chatGrab.php.
I din oprindelige kode includer du denne fil, og fra javascript bruger du
AJAX til at opdatere din div, ved at kalde chatGrab.php.
Birger
-----
http://bbsorensen.dk
http://varmeretter.dk - hverdagsmad. Sundt, nemt, hurtigt og billigt. Daglig
opdatering.
| |
|
|