我的html文档中有两个脚本,一个是外部脚本,一个是内部脚本。我想将它们组合到一个外部javascript文件中。不幸的是,当我将内部脚本放在外部脚本中时,内部脚本功能似乎不起作用。我不明白为什么不会。
下面的组合脚本分为内部和外部内容。
//INTERNAL SCRIPT
var x = 0, y = 0,
vx = 0, vy = 0,
ax = 0, ay = 0;
var points;
var sphere = document.getElementById("sphere");
var counting = false;
var counter = 0;
var numberOne;
if (window.DeviceMotionEvent != undefined) {
window.ondevicemotion = function(e) {
ax = event.accelerationIncludingGravity.x * 5;
ay = event.accelerationIncludingGravity.y * 5;
document.getElementById("counterSpan").innerHTML = Math.round(counter*10)/10;
//document.getElementById("accelerationX").innerHTML = Math.round(e.accelerationIncludingGravity.x * 10)/10;
//document.getElementById("accelerationY").innerHTML = Math.round(e.accelerationIncludingGravity.y * 10)/10;
//document.getElementById("accelerationZ").innerHTML = Math.round(e.accelerationIncludingGravity.z * 10)/10;
var moveX = Math.round(e.accelerationIncludingGravity.x * 10)/10;
//var moveY = Math.round(e.accelerationIncludingGravity.y * 10)/10;
//var moveZ = Math.round(e.accelerationIncludingGravity.z * 10)/10;
if(moveX > 5 || moveX < -5) {
counting = true;
//alert(counting);
if(counter < 100){counter+=0.01;}
}
if ( e.rotationRate ) {
//document.getElementById("rotationAlpha").innerHTML = Math.round(e.rotationRate.alpha * 10)/10;
//document.getElementById("rotationBeta").innerHTML = Math.round(e.rotationRate.beta * 10)/10;
//document.getElementById("rotationGamma").innerHTML = Math.round(e.rotationRate.gamma * 10)/10;
}
}
$( "#btnEnergize" ).click(function() {
numberOne = $("#numberOne").val();
alert(numberOne);
localStorage.setItem('points',numberOne);
if (numberOne <= counter){
counter-=numberOne;
}
else {
alert("Not enough Energize points");
}
});
setInterval( function() {
var landscapeOrientation = window.innerWidth/window.innerHeight > 1;
if ( landscapeOrientation) {
vx = vx + ay;
vy = vy + ax;
} else {
vy = vy - ay;
vx = vx + ax;
}
vx = vx * 0.98;
vy = vy * 0.98;
y = parseInt(y + vy / 50);
x = parseInt(x + vx / 50);
boundingBoxCheck();
//sphere.style.top = y + "px";
//sphere.style.left = x + "px";
}, 25);
}
function boundingBoxCheck(){
if (x<0) { x = 0; vx = -vx; }
if (y<0) { y = 0; vy = -vy; }
if (x>document.documentElement.clientWidth-20) { x = document.documentElement.clientWidth-20; vx = -vx; }
if (y>document.documentElement.clientHeight-20) { y = document.documentElement.clientHeight-20; vy = -vy; }
}
function minmax(value, min, max)
{
if(parseInt(value) < 0 || isNaN(value))
return 0;
else if(parseInt(value) > 100)
return 100;
else return value;
}
//EXTERNAL SCRIPT
jQuery(function($){
var $overlay = $('.overlay'),
resize = true,
map;
var service;
var marker = [];
var pos;
var infowindow;
var placeLoc
var markerValue = [];
var markers
function initialize() {
/*var mapOptions = {
zoom: 8,
center: new google.maps.LatLng(-34.397, 150.644),
mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
}*/
var mapOptions = {
zoom: 15
};
map = new google.maps.Map(document.getElementById('map-canvas'),
mapOptions);
// Try HTML5 geolocation
if(navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function(position) {
var pos = new google.maps.LatLng(position.coords.latitude,position.coords.longitude);
var request = {
location:pos,
center:pos,
radius:1000,
};
infowindow = new google.maps.InfoWindow();
var service = new google.maps.places.PlacesService(map);
service.nearbySearch(request,callback);
pos = new google.maps.LatLng(position.coords.latitude,
position.coords.longitude);
infowindow = new google.maps.InfoWindow({
map: map,
position: pos,
content: 'You Are Here'
});
$('#findMe').data('pos',pos);
map.setCenter(pos);
}, function() {
handleNoGeolocation(true);
});
} else {
// Browser doesn't support Geolocation
handleNoGeolocation(false);
}
function callback(results, status) {
markers = [];
if (status == google.maps.places.PlacesServiceStatus.OK) {
for (var i = 0; i < results.length; i++) {
markers.push(createMarker(results[i]));
}
}
$('#findMe').data('markers',markers);
}
}
function createMarker(place) {
placeLoc = place.geometry.location;
var marker = new google.maps.Marker({
map: map,
position: place.geometry.location,
icon: {
path: google.maps.SymbolPath.CIRCLE,
scale: 8,
fillColor:'00a14b',
fillOpacity:0.3,
fillStroke: '00a14b',
strokeWeight:4,
strokeOpacity: 0.7
},
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.setContent(place.name);
infowindow.open(map, this);
});
return marker;
}
function handleNoGeolocation(errorFlag) {
if (errorFlag) {
var content = 'Error: The Geolocation service failed.';
} else {
var content = 'Error: Your browser doesn\'t support geolocation.';
}
var options = {
map: map,
position: new google.maps.LatLng(60, 105),
content: content
};
var infowindow = new google.maps.InfoWindow(options);
map.setCenter(options.position);
}
google.maps.event.addDomListener(window, 'load', initialize);
$('#show').click(function(){
$overlay.show();
if ( resize ){
google.maps.event.trigger(map, 'resize');
resize = false;
}
});
$('.overlay-bg').click(function(){
$overlay.hide();
});
$( "#findMe" ).click(function() {
var pos = $(this).data('pos'),
markers = $(this).data('markers'),
closest;
if(!pos || !markers){
return;
}
$.each(markers,function(){
var distance=google.maps.geometry.spherical
.computeDistanceBetween(this.getPosition(),pos);
if(!closest || closest.distance > distance){
closest={marker:this,
distance:distance}
}
});
if(closest){
//closest.marker will be the nearest marker, do something with it
//here we simply trigger a click, which will open the InfoWindow
google.maps.event.trigger(closest.marker,'click')
var Loc2 = closest.marker.getPosition();
for (var i=0; i<markers.length; i++) {
var Loc1 = markers[i].getPosition()
if (Loc1.equals(Loc2)){
console.log("its the same");
console.log("marker array Location 1 " + Loc1 + " marker " + i);
console.log("closest Location 2 " +Loc2);
markerValue[i] = numberOne;
console.log( "marker " + i + " now equals " + markerValue[i]);
}
}
}
});
});
答案 0 :(得分:1)
如果你看一下你的外部代码,它就是一个简写的jQuery ready事件处理程序。由于您的内部代码与DOM交互,因此您应该确保它也在相同的事件处理程序上下文中运行。
可能您的内部代码位于页面底部的onload函数内,或者可能位于其自己的ready事件处理程序中,您忘记将其考虑在内。