从 js 文件代码调用 gwt 函数。[错误不是函数]
calling gwt function from js file code.[Error is not a function]
我正在尝试从外部调用我的 GWT 函数 js.But 我遇到了错误
****window.myFunction** 不是函数**
我的js文件是
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center : {
lat : 34.149486,
lng : -117.257317
},
zoom : 13
});
var geocoder = geocoder = new google.maps.Geocoder();
var card = document.getElementById('pac-card');
var input = document.getElementById('pac-input');
var types = document.getElementById('type-selector');
var strictBounds = document.getElementById('strict-bounds-selector');
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(card);
var autocomplete = new google.maps.places.Autocomplete(input);
// Bind the map's bounds (viewport) property to the autocomplete object,
// so that the autocomplete requests use the current map bounds for the
// bounds option in the request.
autocomplete.bindTo('bounds', map);
var infowindow = new google.maps.InfoWindow();
var infowindowContent = document.getElementById('infowindow-content');
infowindow.setContent(infowindowContent);
var marker = new google.maps.Marker({
position : {
lat : 34.149486,
lng : -117.257317
},
map : map,
draggable : true,
anchorPoint : new google.maps.Point(0, -29)
});
google.maps.event
.addListener(
marker,
"dragend",
function(e) {
var lat, lng, address;
geocoder
.geocode(
{
'latLng' : marker.getPosition()
},
function(results, status) {
document
.getElementById('pac-input').value = results[0].formatted_address;
myfunction1()
});
});
autocomplete.addListener('place_changed', function() {
infowindow.close();
marker.setVisible(false);
var place = autocomplete.getPlace();
if (!place.geometry) {
// User entered the name of a Place that was not suggested and
// pressed the Enter key, or the Place Details request failed.
window
.alert("No details available for input: '" + place.name
+ "'");
return;
}
// If the place has a geometry, then present it on a map.
if (place.geometry.viewport) {
map.fitBounds(place.geometry.viewport);
} else {
map.setCenter(place.geometry.location);
map.setZoom(17); // Why 17? Because it looks good.
}
marker.setPosition(place.geometry.location);
marker.setVisible(true);
var address = '';
if (place.address_components) {
address = [
(place.address_components[0]
&& place.address_components[0].short_name || ''),
(place.address_components[1]
&& place.address_components[1].short_name || ''),
(place.address_components[2]
&& place.address_components[2].short_name || '') ]
.join(' ');
}
infowindowContent.children['place-icon'].src = place.icon;
infowindowContent.children['place-name'].textContent = place.name;
infowindowContent.children['place-address'].textContent = address;
infowindow.open(map, marker);
});
// Sets a listener on a radio button to change the filter type on Places
// Autocomplete.
function setupClickListener(id, types) {
var radioButton = document.getElementById(id);
radioButton.addEventListener('click', function() {
autocomplete.setTypes(types);
});
}
setupClickListener('changetype-address', [ 'address' ]);
}
function myfunction1() {
window.myFunction();
}
我的java文件是:
package biz.kaar.service.client.shuttle;
public class Trips extends MyPopup{
Frame f = new Frame("js/location.html")
public popupPanel(){
super() ;
exportMyFunction1() ;
/* some other code line*/
}
//other methods.object of this class is created while loading
public static native void exportMyFunction1() /*-{
$wnd.myFunction =
$entry(@biz.kaar.service.client.shuttle.Trips::myFunction());
}-*/;
public static void myFunction(){
ErrorHandler.logInConsole("working");
}
}
我的location.html文件
<!DOCTYPE html>
<html>
<head>
<title>Place Autocomplete</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
</head>
<body>
<div class="pac-card" id="pac-card">
<div>
<div id="title">
Autocomplete search
</div>
<div id="type-selector" class="pac-controls">
<input type="radio" name="type" id="changetype-address" value="mykaarma">
<label for="changetype-address">Addresses</label>
<input type="radio" name="type" id="changetype-geocode">
<label for="changetype-geocode">Geocodes</label>
</div>
</div>
<div id="pac-container">
<input id="pac-input" type="text"
placeholder="Enter a location" value = "St Marys Rd Sydney NSW 2000 Australia">
</div>
</div>
<div id="map"></div>
<div id="infowindow-content">
<img src="" width="16" height="16" id="place-icon">
<span id="place-name" class="title"></span><br>
<span id="place-address"></span>
</div>
<script src = "location.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places&callback=initMap"
async defer></script>
我的代码中是否遗漏了什么?
谢谢。
您的 JS 代码位于 iframe(Frame
小部件)内,并且您的函数在父 window 上导出,因此它是 window.parent.myFunction()
.
我正在尝试从外部调用我的 GWT 函数 js.But 我遇到了错误 ****window.myFunction** 不是函数**
我的js文件是
function initMap() {
var map = new google.maps.Map(document.getElementById('map'), {
center : {
lat : 34.149486,
lng : -117.257317
},
zoom : 13
});
var geocoder = geocoder = new google.maps.Geocoder();
var card = document.getElementById('pac-card');
var input = document.getElementById('pac-input');
var types = document.getElementById('type-selector');
var strictBounds = document.getElementById('strict-bounds-selector');
map.controls[google.maps.ControlPosition.TOP_RIGHT].push(card);
var autocomplete = new google.maps.places.Autocomplete(input);
// Bind the map's bounds (viewport) property to the autocomplete object,
// so that the autocomplete requests use the current map bounds for the
// bounds option in the request.
autocomplete.bindTo('bounds', map);
var infowindow = new google.maps.InfoWindow();
var infowindowContent = document.getElementById('infowindow-content');
infowindow.setContent(infowindowContent);
var marker = new google.maps.Marker({
position : {
lat : 34.149486,
lng : -117.257317
},
map : map,
draggable : true,
anchorPoint : new google.maps.Point(0, -29)
});
google.maps.event
.addListener(
marker,
"dragend",
function(e) {
var lat, lng, address;
geocoder
.geocode(
{
'latLng' : marker.getPosition()
},
function(results, status) {
document
.getElementById('pac-input').value = results[0].formatted_address;
myfunction1()
});
});
autocomplete.addListener('place_changed', function() {
infowindow.close();
marker.setVisible(false);
var place = autocomplete.getPlace();
if (!place.geometry) {
// User entered the name of a Place that was not suggested and
// pressed the Enter key, or the Place Details request failed.
window
.alert("No details available for input: '" + place.name
+ "'");
return;
}
// If the place has a geometry, then present it on a map.
if (place.geometry.viewport) {
map.fitBounds(place.geometry.viewport);
} else {
map.setCenter(place.geometry.location);
map.setZoom(17); // Why 17? Because it looks good.
}
marker.setPosition(place.geometry.location);
marker.setVisible(true);
var address = '';
if (place.address_components) {
address = [
(place.address_components[0]
&& place.address_components[0].short_name || ''),
(place.address_components[1]
&& place.address_components[1].short_name || ''),
(place.address_components[2]
&& place.address_components[2].short_name || '') ]
.join(' ');
}
infowindowContent.children['place-icon'].src = place.icon;
infowindowContent.children['place-name'].textContent = place.name;
infowindowContent.children['place-address'].textContent = address;
infowindow.open(map, marker);
});
// Sets a listener on a radio button to change the filter type on Places
// Autocomplete.
function setupClickListener(id, types) {
var radioButton = document.getElementById(id);
radioButton.addEventListener('click', function() {
autocomplete.setTypes(types);
});
}
setupClickListener('changetype-address', [ 'address' ]);
}
function myfunction1() {
window.myFunction();
}
我的java文件是:
package biz.kaar.service.client.shuttle;
public class Trips extends MyPopup{
Frame f = new Frame("js/location.html")
public popupPanel(){
super() ;
exportMyFunction1() ;
/* some other code line*/
}
//other methods.object of this class is created while loading
public static native void exportMyFunction1() /*-{
$wnd.myFunction =
$entry(@biz.kaar.service.client.shuttle.Trips::myFunction());
}-*/;
public static void myFunction(){
ErrorHandler.logInConsole("working");
}
}
我的location.html文件
<!DOCTYPE html>
<html>
<head>
<title>Place Autocomplete</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
</head>
<body>
<div class="pac-card" id="pac-card">
<div>
<div id="title">
Autocomplete search
</div>
<div id="type-selector" class="pac-controls">
<input type="radio" name="type" id="changetype-address" value="mykaarma">
<label for="changetype-address">Addresses</label>
<input type="radio" name="type" id="changetype-geocode">
<label for="changetype-geocode">Geocodes</label>
</div>
</div>
<div id="pac-container">
<input id="pac-input" type="text"
placeholder="Enter a location" value = "St Marys Rd Sydney NSW 2000 Australia">
</div>
</div>
<div id="map"></div>
<div id="infowindow-content">
<img src="" width="16" height="16" id="place-icon">
<span id="place-name" class="title"></span><br>
<span id="place-address"></span>
</div>
<script src = "location.js"></script>
<script src="https://maps.googleapis.com/maps/api/js?key=API_KEY&libraries=places&callback=initMap"
async defer></script>
我的代码中是否遗漏了什么?
谢谢。
您的 JS 代码位于 iframe(Frame
小部件)内,并且您的函数在父 window 上导出,因此它是 window.parent.myFunction()
.