Question

我正在搞乱一些代码，但我正在努力实现我想要的东西。在这里的示例中，我有一个地图，显示我的字段中有坐标时：

// Generic Map Display
function mapDisplay() {

        var latval = $('#lat').val(),
            lngval = $('#lng').val();
        if ($.trim(latval) != '' && $.trim(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');
        }
    }

我想要做的是每页执行一次，这样如果页面加载时字段中有值，则显示地图，但如果在页面加载或更改后删除值，则地图将不要改变，因为它只在页面加载开始时读取变量。

有人可以在我的jsfiddle上向我展示如何展示它吗？

Answer 1

您没有在文档就绪调用mapDisplay();

上调用函数mapDisplay

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

演示：Fiddle

Answer 2

window.onload = function(){

mapDisplay();

}

这会在onload事件上运行您的代码

Answer 3

使用：

$(function()
{
    mapDisplay();
}  

// Generic Map Display
function mapDisplay() {

    var latval = $('#lat').val(),
        lngval = $('#lng').val();
    if ($.trim(latval) != '' && $.trim(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（）{}），它被执行。

在页面加载时执行一次脚本

3 个答案: