Delphi-PRAXiS - Javscript-function aufrufen, wenn function im HTML-header

Seite 1 von 2

Delphi-PRAXiS (https://www.delphipraxis.net/forum.php)

- Programmieren allgemein (https://www.delphipraxis.net/40-programmieren-allgemein/)

- - Javscript-function aufrufen, wenn function im HTML-header (https://www.delphipraxis.net/180734-javscript-function-aufrufen-wenn-function-im-html-header.html)

Javscript-function aufrufen, wenn function im HTML-header

Hallo,

ich erstelle eine firemonkey app mit einer einfachen google-maps Einbindung. Zusätzlich möchte ich, dass eine function "marker1" auf das Ereignis "Button2.Click" ausgeführt wird.

Die function findet sich im header.

Die Frage lautet: wie rufe ich eine function auf, die mit jacascript im html-header steht? In der VCL-Version hat es mit HTMLWIndow2 etc. funktioniert, aber nicht in der fmx (firmonkey)-Version.

Delphi-Quellcode:

			unit Unit2;

interface

uses

  System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,

  FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs, FMX.StdCtrls,

  System.Sensors, System.Sensors.Components, FMX.WebBrowser, FMX.ListBox;

type

  TForm2 = class(TForm)

    LocationSensor1: TLocationSensor;

    WebBrowser1: TWebBrowser;

    Button1: TButton;

    procedure FormCreate(Sender: TObject);

    procedure Button1Click(Sender: TObject);

  private

    { Private-Deklarationen }

  public

    { Public-Deklarationen }

  end;

var

  Form2: TForm2;

implementation

{$R *.fmx}

uses Unit1;

const

{ Was used sample from }

{ https://developers.google.com/maps/documentation/javascript/examples/directions-panel }

cRoute =

'<!DOCTYPE html>'

+ '<html>'

+ '  <head>'

+ '    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">'

+ '    <meta charset="utf-8">'

+ '    <title>Displaying text directions with <code>setPanel()</code></title>'

+ '    <style>'

+ '      html, body, #map-canvas {'

+ '        height: 100%;'

+ '        margin: 0px;'

+ '        padding: 0px'

+ '      }'

+ '    </style>'

+ '    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>'

+ '    <script>'

+ ''

+ '   function initialize() {'

+ ''

+ '    var latlng  = new google.maps.LatLng(39.550189, 2.691211); '

+ '    var latlng2 = new google.maps.LatLng(39.551200, 2.691211); '

+ ''

+ '  var mapOptions = {'

+ '    zoom:   16,'

+ '    center: latlng, '

+ '    mapTypeId: google.maps.MapTypeId.ROADMAP, '       // ROADMAP (GROß geschrieben)

+ '  };'

+ '  var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);'

+ '  var marker = new google.maps.Marker({'

+ '    position: latlng,'

+ '    title: "Hello World!"'

+ '  });'

+ '  marker.setMap(map);'

+ ''

+ '}'

+ ''

+ '  function marker1() {new google.maps.LatLng(39.551200, 2.691211)};'// Um diese function geht es                        <--------------

+ ''

+ 'google.maps.event.addDomListener(window, ''load'', initialize);'

+ ''

+ '    </script>'

+ '  </head>'

+ '  <body>'

+ '  <div id="map-canvas" style="width:100%; height:100%"> </div> '

+ '  </body>'

+ '</html>';

procedure TForm2.Button1Click(Sender: TObject);

begin

form2.close;

end;

procedure TForm2.FormCreate(Sender: TObject);

begin

WebBrowser1.LoadFromStrings(cRoute, '');

end;

procedure TButton2.Click (Sender: TObject);

begin

// Was kommt hierhin, um die function marker1 aufzurufen? Die function soll nur ausgeführt werden auf "Button2.Click".         <--------------

end;

end.

Herzlichen Dank. Ich arbeite mich auch gerne ein.

AW: Javscript-function aufrufen, wenn function im HTML-header

[DELPHI]...[/DELPHI] kennst du?

HTML-Code:

			...</head>

<body onload="marker1();">

  <div id=...

:stupid:

Aber gut, das wäre dann nicht in Click, sondern im FormCreate.

@mkinzler: Also dein Link passt ja wie die Faust auf's Auge. :lol:

Zitat:

Delphi-Quellcode:

			procedure TForm2.Button1Click(Sender: TObject);

begin

  form2.close;

end;

Los, haut ihm alle mal auf die Finger.

Lass du mal besser ganz schnell das

Delphi-Quellcode:

Form2.

verschwinden.

AW: Javscript-function aufrufen, wenn function im HTML-header

Zitat:

Zitat von mkinzler (Beitrag 1262132)

http://blogs.embarcadero.com/nikolay...nthedelphixe6/

Daran habe ich auch schon gedacht:

Delphi-Quellcode:

WebBrowser1.EvaluateJavaScript(cChicagoWinona);

Aber ich habe ja keine const, sondern eine function?

AW: Javscript-function aufrufen, wenn function im HTML-header

Zitat:

Zitat von himitsu (Beitrag 1262133)

[DELPHI]...[/DELPHI] kennst du?

HTML-Code:

			...</head>

<body onload="marker1();">

  <div id=...

:stupid:

Aber gut, das wäre dann nicht in Click, sondern im FormCreate.

@mkinzler: Also dein Link passt ja wie die Faust auf's Auge. :lol:

Zitat:

Delphi-Quellcode:

			procedure TForm2.Button1Click(Sender: TObject);

begin

  form2.close;

end;

Los, haut ihm alle mal auf die Finger.

Lass du mal besser ganz schnell das

Delphi-Quellcode:

Form2.

verschwinden.

1. Im FormCreate wäre auch i.O., aber das kann ich ja keinen html-Text einbauen?
2. Was genau hat es mit dem form2 auf sich? Ist das nicht richtig?

AW: Javscript-function aufrufen, wenn function im HTML-header

Zitat:

Zitat von champagner (Beitrag 1262135)

Zitat:

Zitat von mkinzler (Beitrag 1262132)

http://blogs.embarcadero.com/nikolay...nthedelphixe6/

Daran habe ich auch schon gedacht:

Code:

WebBrowser1.EvaluateJavaScript(cChicagoWinona);

Aber ich habe ja keine const, sondern eine function?

Ja dann geht das wohl nicht :roll:

Bitte schau dir das Beispiel genau an (jag es durch den Compiler und schau mit dem Debugger zu, was da passiert) und dann sollte ein Licht angehen ...

AW: Javscript-function aufrufen, wenn function im HTML-header

Zitat:

@mkinzler: Also dein Link passt ja wie die Faust auf's Auge.

Deshalb habe ich ihn ja auch gepostet.

AW: Javscript-function aufrufen, wenn function im HTML-header

Zitat:

Zitat von Sir Rufo (Beitrag 1262139)

...und dann sollte ein Licht angehen ...

Tja, es bleibt leider sehr dunkel. Darf ich nochmals nachfragen, wo ich ansetzen kann? Herzlichen Dank.

AW: Javscript-function aufrufen, wenn function im HTML-header

Den Code der JS-Funktion musst Du in den String schreiben und dann EvaluateJavaScript() übergeben.
Genauso, wie es im Beispiel auch steht.

AW: Javscript-function aufrufen, wenn function im HTML-header

Zitat:

Zitat von mkinzler (Beitrag 1262192)

Den Code der JS-Funktion musst Du in den String schreiben und dann EvaluateJavaScript() übergeben.
Genauso, wie es im Beispiel auch steht.

Ist der Aufruf so i.O.? Die function "markerbc" selbst wird offenbar aber nicht ausgeführt (kein zweiter Marker in der Google Map).

Delphi-Quellcode:

			unit Unit2;

interface

uses

  System.SysUtils, System.Types, System.UITypes, System.Classes, System.Variants,

  FMX.Types, FMX.Controls, FMX.Forms, FMX.Graphics, FMX.Dialogs, FMX.StdCtrls,

  System.Sensors, System.Sensors.Components, FMX.WebBrowser, FMX.ListBox;

type

  TForm2 = class(TForm)

    LocationSensor1: TLocationSensor;

    WebBrowser1: TWebBrowser;

    Button1: TButton;

    procedure FormCreate(Sender: TObject);

    procedure Button1Click(Sender: TObject);

  private

    { Private-Deklarationen }

  public

    { Public-Deklarationen }

  end;

var

  Form2: TForm2;

implementation

{$R *.fmx}

uses Unit1;

const

{ Was used sample from }

{ https://developers.google.com/maps/documentation/javascript/examples/directions-panel }

cRoute =

'<!DOCTYPE html>'

+ '<html>'

+ '  <head>'

+ '    <meta name="viewport" content="initial-scale=1.0, user-scalable=no">'

+ '    <meta charset="utf-8">'

+ '    <title>Displaying text directions with <code>setPanel()</code></title>'

+ '    <style>'

+ '      html, body, #map-canvas {'

+ '        height: 100%;'

+ '        margin: 0px;'

+ '        padding: 0px'

+ '      }'

+ '    </style>'

+ '    <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>'

+ ''

+ '    <script>'

+ ''

+ '    function initialize() {'

+ '                             var latlng  = new google.maps.LatLng(39.550189, 2.691211); '

+ ''

+ '                             var mapOptions = {'

+ '                                                 zoom:   16,'

+ '                                                 center: latlng, '

+ '                                                 mapTypeId: google.maps.MapTypeId.ROADMAP, '       // ROADMAP (GROß geschrieben)

+ '                                              };'

+ '                             var map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);'

+ '                             var marker = new google.maps.Marker({position: latlng,'

+ '                                                                  title: "Hello World!",'

+ '                                                                  animation: google.maps.Animation.BOUNCE,'

+ '                                                                 });'

+ '                             marker.setMap(map);'

+ '                           }'

+ ''

+ '    function markerbc()    {'                                               <----------------------------- hier die function "markerbc"; stimmt sie so?

+ '                             var latlng2 = new google.maps.LatLng(39.551200, 2.691211); '

+ '                             var marker1 = new google.maps.Marker({position: latlng2,'

+ '                                                                  title: "Hello aaa!",'

+ '                                                                 });'

+ '                             marker1.setMap(map);'

+ '                           }'

+ ''

+ '    google.maps.event.addDomListener(window, ''load'', initialize);'

+ ''

+ ''

+ '    </script>'

+ ''

+ '  </head>'

+ '  <body>'

+ '  <div id="map-canvas" style="width:100%; height:100%"> </div> '

+ '  </body>'

+ '</html>';

procedure TForm2.Button1Click(Sender: TObject);

begin

form2.close;

end;

procedure TForm2.FormCreate(Sender: TObject);

  const

        a = 'markerbc()';                                           <----------------------------- hier die const definiert

begin

WebBrowser1.LoadFromStrings(cRoute, '');

WebBrowser1.EvaluateJavaScript(a);                                  <----------------------------- hier die function "markerbc" aufgerufen

end.

Seite 1 von 2