1

私は基本的に、値を持つ「lng」と「lat」という名前のページ上の2つのフィールドが見つかったときにマップを表示するスクリプトをページに配置したいと考えています。

これは、値を持つフィールドがページにある場合はマップを表示しようとするが、そうでない場合は表示しないことを意味します。

これは私がこれまでに持っているコードです: http://jsfiddle.net/spadez/xJhmk/3/

function mapDisplay() {

    var latval = $('input[id=lat]').val();
    var lngval = $('input[id=lng]').val();

    var mapOptions = {
        zoom: 8,
        center: new google.maps.LatLng(latval, lngval),
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        disableDefaultUI: true,
        scrollwheel: false,
        draggable: false
    };
    var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
}


$(function () {
    mapDisplay();
});

現時点ではjqueryがあまり得意ではありませんが、これは私が試したもので、うまくいきませんでした:

if (latval !=NULL && lngval != NULL)){
...my code
}

もう少し知識のある人が、このアプローチが機能しない理由を理解するのに役立ちますか?

4

6 に答える 6

1

これを試して

if ( !isNaN(latval) && !isNaN(lngval)) {

したがって、基本的には2つの入力が数値であるかどうかをチェックし、真の場合にのみif条件にステップインします。

また

var latval = $('input[id=lat]').val();
var lngval = $('input[id=lng]').val();

として安全に書くことができます

var latval = $('#lat').val(),
    lngval = $('#lng').val();

changeマップを表示する入力のイベントをフックできます

コード

function mapDisplay() {

    var latval = $('#lat').val(),
        lngval = $('#lng').val();
      if (!isNaN(parseFloat(latval)) && !isNaN(parseFloat(lngval))) {
        var mapOptions = {
            zoom: 8,
            center: new google.maps.LatLng(latval, lngval),
            mapTypeId: google.maps.MapTypeId.ROADMAP,
            disableDefaultUI: true,
            scrollwheel: false,
            draggable: false
        };
        var map = new google.maps.Map(document.getElementById('map_canvas'), mapOptions);
        $('#map_canvas').removeClass('hidden');
    } else {
        $('#map_canvas').addClass('hidden');
    }
}


$(function () {
    $('input').on('change', mapDisplay).trigger('change');
});

フィドルをチェック

于 2013-06-21T08:35:50.043 に答える
1

あなたは緯度/経度をチェックしている可能性があるので、それらが数値であるかどうかもチェックします。

function checkValues() {
    var valueOK = false;
    if($.isNumeric($('#lat').val())) { 
         if($.isNumeric($('#lng').val())) valueOK = true;
    }

    return valueOK;
}

$(function () {
    if(checkValues) {
         mapDisplay();
    }
}
于 2013-06-21T08:45:42.193 に答える