Question

我有一个脚本，在按钮单击时通过搜索数组找到最接近你的位置，然后在另一个数组中找到相应的条目并向该数组添加一个数字。但是我在将值附加到它时遇到问题。它不是以“0”开头，然后加1使其成为“1”，而是像“01”那样出现，我认为这是因为它是一个字符串，我试图将其解析为Int这不起作用。我认为这可能是我最初在数组中设置值的方式有问题，我做了一个For循环将前200个值设置为0，虽然我只想运行一次然后单击按钮它会附加键入文本字段的数字。我不确定如何在这个问题上取得进展。代码如下：

我试图强调我的代码的重要部分，我认为问题所在。

问题的屏幕截图（而不是添加我放在框中的值，它只是将它附加到结尾，就好像它是一个字符串）：

jQuery(function($){



    var Loc1;
    var Loc2;
    var service;
    var marker = [];
    var pos;
    var infowindow;
    var placeLoc
    **var j;**
    **var markerValue  =  [];**

            **for (j = 0; j<200; j++ ){

        markerValue[j] = 0;


    }**

    var markers;

    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;
        }       
    }



    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;

}



  var $overlay = $('.overlay'),
      resize = true,
      map;



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'
      });
        $('#btnEnergize').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]));
    }
  }
  $('#btnEnergize').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();

});


**$( "#btnEnergize" ).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')


     Loc2 =  closest.marker.getPosition();
     numberOne = $("#numberOne").val();
     alert(numberOne);
     localStorage.setItem('points',numberOne);

     for (var i=0; i<markers.length; i++) {
         Loc1 = markers[i].getPosition();

        if (Loc1.equals(Loc2) /*&& numberOne <= counter*/){


            console.log("marker array Location 1 " + Loc1 + " marker " + i);
            console.log("closest Location 2 " +Loc2);

            counter -= numberOne;
            markerValue[i] += numberOne;


            console.log( "marker " + i + " now equals " + markerValue[i]);

        }
     }
    } 

alert (markerValue[19]);

});**


});// JavaScript Document

Answer 1

从略过代码看起来你正在检索这里的值：

numberOne = $("#numberOne").val();

应该是

numberOne = parseInt($("#numberOne").val());

您在函数parseInt中使用minmax()，但该函数未在使用中。如果这是您用于将值解析为int的那个，那么它有一个缺陷，它只返回0和100上的解析值：

function minmax(value, min, max) 
{
    // Flip these two, CHECK FOR isNaN first.
    if(parseInt(value) < 0 || isNaN(value)) 
        return 0; 
    else if(parseInt(value) > 100) 
        return 100; 
    else return value; // Here you return value, not parseInt(value)
}

按钮点击增加价值

1 个答案: