-2

我对 JQuery 很陌生，我正在尝试创建一个事件，因此当单击表行时它会执行某些操作，但它会有一个for循环，但这不起作用所以我删除了循环并发出警报以查看数组中有多少项目，它会发出警报 0。我不确定为什么，在页面加载时，脚本会从我的数据库中生成标记并将它们加载到左侧的地图上（工作正常且符合预期）屏幕上制作了一张桌子，上面写着每个站点在哪条街上，当您单击表格行时，它应该居中并放大标记（我可以自己弄清楚那部分）但现在它告诉我那里数组中什么都没有，我不知道为什么。谢谢。

  <?php
require_once('config.inc.php');
require_once($rootdir . $dirsubfolder . 'navbar.php');
include($rootdir . $dirsubfolder . 'php/findmarkers.php');
?>
<script>

$(document).ready(function() {
var arrMarkers = [];
var zoom = 6;
var initialLocation;
var map;
var markersArray = new Array();

$("table#listOfStops").find('tr').each(function() {
  $(this).on('click', function() {

      alert(arrMarkers.length);


  });
});

$(window).resize(function () {
    var h = $(window).height(),
        offsetTop = 230; // Calculate the top offset
    $('#gmaps').css('height', (h - offsetTop));
  }).resize();
  loadScript();
});
function initialize() {
  geocode = new google.maps.Geocoder();
 var mapOptions = {
  zoom: 10,
  center: new google.maps.LatLng(56.7626362, -111.379652),
  mapTypeId: google.maps.MapTypeId.ROADMAP,
  disableDefaultUI: false,
  zoomControl: true,
  zoomControlOptions: {
    style: google.maps.ZoomControlStyle.LARGE
  }
};

  map = new google.maps.Map(document.getElementById('gmaps'),
  mapOptions);

  google.maps.event.addListener(map, 'click', function(event) {
    var latitude = event.latLng.lat();
    var longitude = event.latLng.lng();
    deleteOverlays();
    addMarker(event.latLng);
    updateTextFields(latitude, longitude);
  });
  <?php while($stmt -> fetch()) { ?>
  var long = "<?php echo $gLongitude ?>";
  var lati = "<?php echo $gLatitude; ?>";
  var title = "<?php echo $gTitle; ?>"
  setMarker(lati, long, title);
  <? } $stmt -> close(); $mysqli -> close();?>



}

function setMarker(lat,lon, markerTitle) {
  var latLonMarker = new google.maps.LatLng(lat,lon);
  marker = new google.maps.Marker({
    position: latLonMarker,
    map: map,
    icon: 'icon.png',
    title: markerTitle
  });
  google.maps.event.addListener(marker, 'dragend', function() {
    $('#inputLatitude').val(this.getPosition().lat());
    $('#inputLongitude').val(this.getPosition().lng());
  });
  arrMarkers.push(marker);
}


function loadScript() {
  var script = document.createElement('script');
  script.src = 'https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=true&' +
  'callback=initialize';
  document.body.appendChild(script);
}
</script>

<?php include($rootdir . $dirsubfolder . 'php/findmarkers.php'); ?>

<div style="padding-top: 5%; padding-bottom: 5%;">
<div class="container-fluid">
<div class="row-fluid">
  <div class="span3 container hero-unit">
  <h2 style="text-align: center;">Route <?php echo $gRouteNumber ?></h2>
  <h4 style="text-align: center;" class="alert-info">Begins <? echo $gArrivalTime; ?></h4>
  <br />

  <table id="listOfStops" class="table table-striped">
  <thead>
  <tr>
    <th>Stop #</th>
    <th>Street Name</th>
  </tr>
  </thead>
  <tbody>
  <?php
  $i = 0;
  while($stmt -> fetch()) {
    echo '<tr  id="' . $i . '">';
    echo '<td>' . $gStopNumber . '</td>';
    echo '<td>' . $gStreetName . '</td>';
    echo '</tr>';
  $i++;} $stmt -> close(); $mysqli -> close(); ?>  
  </tbody>
  </table>




  </div>

<div class="span9">
<div id="gmaps"></div>
</div>
</div>
</div>
</div>




<?php
require_once('footer.php');
?>
4

1 回答 1

1

As I already stated in my comment, you are declaring arrMarkers as a local variable in your document ready function.

That means, it is undefined in the setMarker function.

Try making it a global variable and you should be good.

于 2013-03-07T05:50:40.247 回答