Hallo und wunderschönen guten Abend. Ich habe da mal ein Problemchen im bereich Webseite für "Steuerungsanwendungen". Also ich möchte eine variable aus einer Datei an einen Javascript (jquery mobile) übergeben. Dieses allerdings permanent im Sekundentakt c.a. Zurzeit lade ich in Php die Variable aus der Datei und übergebe diese an das Script. Scheinbar gibt es aber in Php keine schleife um diese immer wieder geschehen zu lassen ? und in Java gibt es scheinbar nicht die Möglichkeit eine Datei zu lesen? Die Möglichkeit über Timeout die ganze seite neuzuladen finde ich eher unschön. Ich habe nicht wirklich Ahnung von Php und co. Habt ihr eventuell eine idee ?
:
Verschoben durch User
Werner M schrieb: > Ich habe da mal ein Problemchen im bereich Webseite für > "Steuerungsanwendungen". Also ich möchte eine variable aus einer Datei > an einen Javascript (jquery mobile) übergeben. Dieses allerdings > permanent im Sekundentakt c.a. Wie muss man sich das vorstellen: Wird die Datei einmal pro Sekunde geöffnet, der bestehende Wert in ihr wird überschrieben, und dann wird sie wieder geschlossen? Oder ist sie zur Laufzeit vielleicht gar permanent geöffnet und es werden immer wieder neue Werte reingeschrieben, also eine Art Logfile? > Zurzeit lade ich in Php die Variable aus der Datei und übergebe diese an > das Script. Scheinbar gibt es aber in Php keine schleife um diese immer > wieder geschehen zu lassen ? Es gibt die üblichen Arten von Schleifen in PHP, also for, while, etc. Was Du aber vielleicht eher meinst, sind Events bzw. Timer. Auch die gibt es in PHP: http://www.php.net/manual/en/class.event.php http://www.php.net/manual/en/class.evtimer.php Du könntest also einen Timer laufen lassen, der einmal pro Sekunde ein Event auslöst. Daraufhin könnte man dann die Datei lesen, und mit dem erhaltenen Wert auch eine HTML-Seite generieren. In dieser stünde der Wert dann einem wie auch immer gearteten JavaScript-Code zur Verfügung. Die Frage ist nun, ob diese Vorgehensweise überhaupt sinnvoll ist ;-) Wie so oft gilt: Beschreibe nicht Deinen bisher gewählten Ansatz, denn der kann völliger Murks sein. Beschreibe lieber, was Deine Anwendung eigentlich wirklich machen soll, und was der Sinn dahinter ist. Vielleicht magst Du Dir mal JSON anschauen: http://de.wikipedia.org/wiki/JSON > und in Java gibt es scheinbar nicht die Möglichkeit eine Datei zu lesen? Natürlich gibt es in Java diese Möglichkeit. In JavaScript aber nicht, und das muss auch so sein. Überleg mal, Du würdest eine beliebige Website besuchen und der von dort geladene JavaScript-Code könnte beliebig Dateien auf Deiner Festplatte auslesen oder verändern! Das willst Du nicht wirklich ;-)
Man könnte das wohl mit AJAX machen. Nein, ist kein Scheuermittel... sondern in dem Fall wohl ein Steuermittel :-) http://stackoverflow.com/questions/20125763/ajax-reload-every-10-seconds http://stackoverflow.com/questions/5681380/refresh-a-table-with-jquery-ajax-every-5-seconds
Mark Brandis schrieb: > Man könnte das wohl mit AJAX machen. zustimm. ajax wurde extra dafür gebaut einzelne elemente einer seite mit neuen daten vom server aufzufrischen ohne die gesamte seite neu zu laden. 1. imho sollte der TO verstehen das es sich beim http-protokoll um eine stateless verbindung handelt - man macht einen tcp-port auf, holt sich die daten (html-seite vom server), und schließt die tcp-verbindung wieder. aus. 2. der server kann keine daten zum client senden ohne das der client sie vorher angefordert hat. 3. es gibt tricks und kniffe um die punkte 1 und 2 zu umgehen - ajax ist einer davon, "sessions" im allgemeinen ein weiterer. oh und java != javascript ;)
AJAX wäre schon das Richtige, aber wenn man sich damit auf die Schnelle nicht auseinandersetzen will, der kann sich mit einem (unsichtbaren) iFRame behelfen, dessen Inhalt (Textfeld) sich per Metatag aktualisiert <meta http-equiv="refresh" content="1"> Im Code der sichtbaren Seite holt sich dann ein Javascript-Timer diese Daten über einen DOM-Zugriff aus dem iFrame ...
Werner M schrieb: > Zurzeit lade ich in Php die Variable aus der Datei und übergebe diese an > das Script. Scheinbar gibt es aber in Php keine schleife um diese immer > wieder geschehen zu lassen ? und in Java gibt es scheinbar nicht die > Möglichkeit eine Datei zu lesen? Falscher Ansatz. Nicht der Server sendet zyklisch die Daten an den Client (Browser), sondern der Client holt sich zyklisch die Daten vom Server. Dafür wurde AJAX erfunden, und jQuery als Framework nimmt einem einiges der Arbeit ab, das in Javascript "von Hand" mit XMLHttpRequest selbst zu machen, wobei auch das keine Raketenwissenschaft ist.
Klaar XMLHttpRequest da hätt ich auch drauf kommen können. das Klappt schonmal teilweise. Allerdings funkt mir der Browser cache dazwischen. Zumindest beim Iexplorer und beim Opera Google geht wunderbar. Dieses Problem hatte ich schonmal das konnte man irgendwie umgehen. Ich meine mich schwach zu errinnern das das sogar ganz einfach war ?! LG
Werner M schrieb: > Dieses Problem hatte ich schonmal das konnte man irgendwie umgehen. Ich > meine mich schwach zu errinnern das das sogar ganz einfach war ?! Das hier kann gehen, muss aber nicht immer: http://ajaxpatterns.org/XMLHttpRequest_Call#How_will_caching_be_controlled.3F Was immer geht aber etwas unschoen ist, ist ein zufaelliges Schluessel-/Wertpaar and die URL als GET Parameter zu haengen, um so dem Browser zu sagen "das ist jetzt was neues". Nebenbei, je nachdem wieviel Aufwand du reinstecken willst, kannst du anstatt einem Pull Model auch ein Push Model verwenden mit AJAX, d.h. der Browser fragt nicht staendig den Server ob es was neues gibt, sondern der Server "sagt" dem Browser wenn es etwas neues gibt indem er ihm einfach neue Daten schickt. Dazu koenntst du mal nach "Reverse AJAX" oder "Comet" Googeln.
:
Bearbeitet durch User
zwei möglichkeiten um das cache-problem zu umgehen/reduzieren/lösen: 1. z.b. jquery bietet die möglichkeit, den cache für ajax-calls zu deaktivieren (und vereinfacht so nebenbei auch noch den js-code).
1 | var int = window.setInterval(function() { |
2 | $.ajax({ |
3 | url: http://localhost/ajax.php, |
4 | data: '_get=data', |
5 | success: function(data) { |
6 | $('#display').html(data); |
7 | } |
8 | }); |
9 | }, 500); |
nur schnell runtergeschrieben, ohne garantie dass die optionen alle stimmen oder ob noch ein/zwei fehlen 2. das script, das die daten zurückliefert kann (zusätzlich) einen do-not-chache header schicken und ein last-modification-date irgendwann in der vergangenheit
Ich habs jetzt. nur ob das alles so richtig is kann ich nicht sagen. Ist sicher auch kein schöner Code. Wie gesagt ich habe eignetlich keine Ahnung was ich da mache :)
1 | <!DOCTYPE html>
|
2 | <html>
|
3 | <head>
|
4 | <meta charset="utf-8"> |
5 | <meta name="viewport" content="initial-scale=1.0, user-scalable=no"> |
6 | <meta name="apple-mobile-web-app-capable" content="yes"> |
7 | <meta name="apple-mobile-web-app-status-bar-style" content="black"> |
8 | <title>abc</title> |
9 | |
10 | |
11 | <link rel="stylesheet" h ref="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.css"> |
12 | |
13 | <!-- Extra Codiqa features -->
|
14 | <link rel="stylesheet" h ref="codiqa.ext.css"> |
15 | |
16 | <!-- jQuery and jQuery Mobile -->
|
17 | <script src="https://d10ajoocuyu32n.cloudfront.net/jquery-1.9.1.min.js"></script> |
18 | <script src="https://d10ajoocuyu32n.cloudfront.net/mobile/1.3.1/jquery.mobile-1.3.1.min.js"></script> |
19 | |
20 | <!-- Extra Codiqa features -->
|
21 | <script src="https://d10ajoocuyu32n.cloudfront.net/codiqa.ext.js"></script> |
22 | |
23 | |
24 | |
25 | |
26 | <script>
|
27 | var xmlhttp; |
28 | function loadXMLDoc(url,cfunc) |
29 | {
|
30 | xmlhttp=new XMLHttpRequest(); |
31 | xmlhttp.onreadystatechange=cfunc; |
32 | xmlhttp.open("Post",url,true); |
33 | xmlhttp.send(); |
34 | }
|
35 | |
36 | |
37 | |
38 | |
39 | |
40 | |
41 | function timer() |
42 | {
|
43 | setTimeout("myFunction()", 1000) |
44 | }
|
45 | |
46 | function myFunction() |
47 | {
|
48 | loadXMLDoc("counter.txt",function() |
49 | {
|
50 | if (xmlhttp.readyState==4 && xmlhttp.status==200) |
51 | {
|
52 | $va = xmlhttp.responseText; |
53 | $('#test1').val($va); |
54 | $('#test1').slider('refresh'); |
55 | |
56 | }
|
57 | });
|
58 | |
59 | timer(""); |
60 | |
61 | }
|
62 | |
63 | |
64 | |
65 | window.onload = myFunction(); |
66 | </script>
|
67 | |
68 | |
69 | </head>
|
70 | |
71 | <body>
|
72 | |
73 | <!-- Home -->
|
74 | <div data-role="fieldcontain" data-controltype="slider"> |
75 | <label for="Id2">test1 </label> <input id="test1" type="range" name="slider" value="44" min="0" max="100" data-highlight="false"></div> |
76 | <div data-role="fieldcontain" data-controltype="slider"> |
77 | <label for="Id1">test2 </label> <input id="test2" type="range" name="slider" value="50" min="0" max="100" data-highlight="false"></div> |
78 | <p>
|
79 | |
80 | <p></p>
|
81 | </body>
|
82 | </html>
|
83 | |
84 | |
85 | |
86 | <script>
|
87 | |
88 | $(document).ready(function(){ |
89 | $('#test1').on('slidestop',function(){ |
90 | |
91 | |
92 | $('#test2').val($('#test1').slider().val()); |
93 | $('#test2').slider('refresh'); |
94 | |
95 | |
96 | $.ajax({ |
97 | url: '/s2/counter.php?number='+$('#test1').slider().val() |
98 | |
99 | });
|
100 | |
101 | });
|
102 | |
103 | });
|
104 | |
105 | </script>
|
P.s. Der Beitrag scheint Spam zu enthalten: "h ref="
Wird beim Verweis auf extrene Libs in Javascript immer die desamte Datei heruntergeladen oder nur die aufgerufenen Funktionen? Ist das nicht - gerade bei Mobilgeräten - suboptimal?
Frank schrieb: > Wird beim Verweis auf extrene Libs in Javascript immer die desamte Datei > heruntergeladen Natürlich. > oder nur die aufgerufenen Funktionen? Der Overhead, das zu verwalten, wäre ... beträchtlich. Javascript-Libraries sind allerdings i.d.R. ziemlich kompakt, jquery 1.8 beispielsweise ist knapp 270 kByte groß. Üblicherweise wird so etwas im Cache des Browsers gespeichert, so daß das auch bei mobiler Anwendung nicht allzusehr ins Gewicht fällt. Für die Minimalanwendung mit XMTHttpRequest & Co. ist allerdings kein jQuery erforderlich.
da du jquery sowieso lädst, kannst du den teil
1 | var xmlhttp; |
2 | function loadXMLDoc(url,cfunc) |
3 | { |
4 | xmlhttp=new XMLHttpRequest(); |
5 | xmlhttp.onreadystatechange=cfunc; |
6 | xmlhttp.open("Post",url,true); |
7 | xmlhttp.send(); |
8 | } |
9 | |
10 | function timer() |
11 | { |
12 | setTimeout("myFunction()", 1000) |
13 | } |
14 | |
15 | function myFunction() |
16 | { |
17 | loadXMLDoc("counter.txt",function() |
18 | { |
19 | if (xmlhttp.readyState==4 && xmlhttp.status==200) |
20 | { |
21 | $va = xmlhttp.responseText; |
22 | $('#test1').val($va); |
23 | $('#test1').slider('refresh'); |
24 | |
25 | } |
26 | }); |
27 | |
28 | timer(""); |
29 | |
30 | } |
31 | |
32 | window.onload = myFunction(); |
auch kürzer schreiben (und in die document.ready() integrieren):
1 | var interval; // mit der variable kann das interval wieder beendet werden |
2 | |
3 | $(document).ready(function(){ |
4 | $('#test1').on('slidestop',function(){ |
5 | $('#test2').val($('#test1').slider().val()); |
6 | $('#test2').slider('refresh'); |
7 | |
8 | // hier wird nur ein zähler an ein counter-script übergeben? |
9 | $.ajax({ |
10 | url: '/s2/counter.php?number='+$('#test1').slider().val() |
11 | }); |
12 | }); |
13 | |
14 | interval = window.setInterval(function() { |
15 | $.ajax({ |
16 | url: 'counter.txt', |
17 | success: function(data) { |
18 | $('#test1').val(data); |
19 | $('#test').slider('refresh'); |
20 | } |
21 | }); |
22 | }, 1000); |
23 | }); |
ich habe jetzt nicht nachgesehen was .slider() ist/macht bzw. wofür das codiqa-plugin verwendet wird. im großen und ganzen sollte der refresh aber so funktionieren.
Bitte melde dich an um einen Beitrag zu schreiben. Anmeldung ist kostenlos und dauert nur eine Minute.
Bestehender Account
Schon ein Account bei Google/GoogleMail? Keine Anmeldung erforderlich!
Mit Google-Account einloggen
Mit Google-Account einloggen
Noch kein Account? Hier anmelden.