2013-03-06 24 views
-2

我對JQuery非常陌生,我試圖做一個事件,所以當表格行被點擊時它會做一些事情,但它會有一個for循環,但那不是'工作,所以我刪除了循環,並做了一個警報,看看有多少項目在數組內,它提醒0.我不知道爲什麼,在頁面加載腳本從我的數據庫生成標記並將它們加載到地圖上(這工作正常和按預期)在屏幕左側的桌子上,說什麼街道每個停止打開,當你點擊表格行時,它應該居中放大標記(我可以計算出部分出於我自己)但現在它告訴我陣列中沒有任何東西,我不知道爲什麼。謝謝。陣列警報0 for .length不知道爲什麼

<?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'); 
?> 
+1

你到底在哪裏填寫'arrMarkers'? – 2013-03-06 22:19:19

+0

我建議使用'<?php'而不是'<?' – 2013-03-06 22:20:09

+0

你甚至沒有發表一個表,所以我們怎麼知道'$(「table#listOfStops」)。find('tr')'是在做什麼? – j08691 2013-03-06 22:20:19

回答

1

正如我在我的評論已經指出,您聲明arrMarkers在你document ready函數的局部變量。

這意味着,它是setMarker函數中的undefined

試着讓它成爲一個全局變量,你應該很好。

相關問題