0

Googleマップをロードする次のコードがあります。jQuery を 1.7.2 から 1.8.3 にアップグレードしました。壊れましたが、どこが壊れているのかわかりません。以下にコーディングします。この種の移行の問題をデバッグするために使用できる jQuery LINT タイプのツールはありますか?

コンソールにエラーはありません。マップはまったく表示されませんでした。(jQueryの変更を理解したいのですが、修正したようです)

var mcMapPage = null;
var mcGoogleScriptStatus = "";
var mcKmlStatus = "";



$(document).on("pageshow", '#map-show-page', function() {
// adjust content height to be page height - minus footer and header
var $page = $(this)
$page.find('[data-role=content]')
.height(
  $(window).height() - 
  ( $page.find('[data-role=header]').last().height() 
  + $page.find('[data-role=footer]').last().height())
);

loadMap($(this));
})


// split into load map and a callback to process after the google data is loaded
function loadMap(page) {
mcMapPage = page;  // store this so the callback can reference
mcGoogleScriptStatus = "loaded";

// could try looking for gstatic scripts, but this breaks if google changes, so   stick with
// looking for the initial js file
var scriptNode = document.getElementsByTagName("head") [0].querySelector('script[src^="http://maps.googleapis.com"]');
if (scriptNode == null) {
    mcGoogleScriptStatus = "loading";
    var script = document.createElement("script");
    script.type="text/javascript";
    script.src = "http://maps.googleapis.com/maps/api/js?  sensor=true&callback=postLoadGS";
    document.getElementsByTagName("head")[0].appendChild(script);
} else {
    if (mcKmlStatus != "loading") {
        mcKmlStatus = "loading";
        postLoadGS();
    }
}
 }

function postLoadGS() {
mcGoogleScriptStatus = "loaded";

var mapOptions = {
    zoom: 11,
    mapTypeId: google.maps.MapTypeId.ROADMAP
}   
var map = new google.maps.Map(mcMapPage.find('#map-div').get(0),mapOptions);
$(mcMapPage).data('map', map);

mcKmlStatus = "loading";
loadSelectedKml(mcMapPage);
}

function loadSelectedKml(page) {
// load active kml file
page = typeof page !== 'undefined' ? page : $.mobile.activePage;
var button = page.find('a.[data-role="radio-button"].ui-btn-active'),
    kmlUrl = button.attr('data-kml'),
    kmlLayer = page.data('kmlLayer');

if ( kmlLayer ) {
    // remove current layer from map
    try {
        kmlLayer.setMap()
    } catch (error) {
        // ignore it
    }
    page.removeData('kmlLayer')
}

if ( kmlUrl && kmlUrl != "") {
    var noCache = true
    if ( noCache )
    {
        var queryOperator = kmlUrl.indexOf("?") == -1 ? "?" : "&"
        kmlUrl += queryOperator + "no-cache-value=" + new Date().getTime()
    }
    kmlLayer = new google.maps.KmlLayer(kmlUrl, {'preserveViewport': false})
    kmlLayer.setMap(page.data('map'))

    page.data('kmlLayer', kmlLayer)
}
mcKmlStatus = "loaded";
}

$(document).on('click', 'a.[data-role="radio-button"]', function() {    
loadSelectedKml()
return true
})

$(document).on("click", '#map-show-page div#map-div a', function(event) {
// intercept and open with MapController using System.open_url
var targetUrl = this.href

// JQM ajax likely hijacked, if so find the real target URL
if ( $(this).data('href') != undefined) {
    targetUrl = $(this).data('href')
}

// decide if this target url is to be opened externally
var doOpen = !(targetUrl == "" || targetUrl.indexOf("http:") != 0 ||
             targetUrl.indexOf("http://127.0.0.1") == 0 ||  targetUrl.indexOf("http://localhost") == 0 );

if ( doOpen ) {
    var openUrl = "/app/Map/system_open_url?target=" + encodeURIComponent(targetUrl)
    $.get(openUrl)
}

event.preventDefault();
return false;
})

$(document).on('scrollstop', '#map-show-page', function(event) {
// if the window scrolled, scroll it back to zero
if ( $(window).scrollTop() > 1) {
    $(window).scrollTop(0);
}
})

$(document).on("pagebeforehide", '#map-show-page', function() {
mcKmlStatus = "";
})

うーん..以下はもうサポートされていないようです:

$(document).on('click', 'a.[data-role="radio-button"]', function() {    
   loadSelectedKml()
   return true
})

それを次のように変更すると:

a[data-role="radio-button"]

それはうまくいくようです。このjQueryの変更を拡張できる人はいますか? jQuery のバグでしたか、それともセレクターの動作方法を変更したのでしょうか?

4

0 に答える 0