当其容器还包含任何图像时,复选框会触发事件两次

时间:2013-02-28 02:17:49

标签: javascript jquery google-maps jquery-tabs

我的网站上有谷歌地图。当单击相应的标记并且包含具有单个id的复选框时,每个infowindow都会打开。选中该复选框后,将触发控制台消息。这是代码:

function initialize() 
{
    var mapOptions = 
    {
        center: new google.maps.LatLng(-34.600, -58.400),
        zoom: 12,
        mapTypeId: google.maps.MapTypeId.ROADMAP,
        minZoom: 12,
        scrollwheel: false,
    };

    var map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions);

    var point1 = new google.maps.LatLng(-34.600, -58.400)
    dot0001 = new google.maps.Marker(
    {
        position: point1,
        map: map,
    })

    var point2 = new google.maps.LatLng(-34.620, -58.400)
    dot0002 = new google.maps.Marker(
    {
        position: point2,
        map: map,
    })

    var infowindow = new google.maps.InfoWindow({});

    function filltheinfowindow(markername, numbercode, object) 
    {
        infowindow.open (map, markername)
        infowindow.setContent( 
            '<div id="tabsinfo'+numbercode+'" class="infotabs">'+
            '<ul><li><a href="#tabsinfo0001-1">Details</a></li>'+
            '<li><a href="#tabsinfo0001-2">Photos</a></li></ul>'+

            '<div id="tabsinfo0001-1">'+
            '<input name="" type="checkbox" id="checkboxinfo'+numbercode+'" value="">'+
            '</div>'+

            '<div id="tabsinfo0001-2">'+
            '<img src="_objects/_object0001/_images/1.jpg">'+
            '</div>'+   
        '</div>')
    }

    function activatecheckbox(numbercode)
    {
        $("#tabsinfo"+numbercode).tabs();

        $('#checkboxinfo'+numbercode).change(function() 
        {
            if($('#checkboxinfo'+numbercode).is(':checked'))
            {
                console.log("checkboxtest")
            }
        })
    }

    google.maps.event.addListener(dot0001, 'click', function()
    {
        filltheinfowindow(dot0001, "0001")
    })

    google.maps.event.addListener(dot0002, 'click', function()
    {
        filltheinfowindow(dot0002, "0002")
    })

    google.maps.event.addListener(infowindow, 'domready', function()    
    {
        activatecheckbox("0001") 
    })

    google.maps.event.addListener(infowindow, 'domready', function()
    {
        activatecheckbox("0002") 
    })
}

以下是问题:选中复选框后,控制台消息会被触发两次。

这是奇怪的事情:当我在第二个选项卡中没有图像的情况下加载网页时,控制台消息只会触发一次,就像它应该的那样。不幸的是,图像是我网站的重要组成部分。

对我来说,这绝对没有意义。

任何帮助表示赞赏

1 个答案:

答案 0 :(得分:1)

在我看来,你有两个'domready'事件听众。

1) google.maps.event.addListener(infowindow, 'domready', function()    
{
    activatecheckbox("0001")  
})

2) google.maps.event.addListener(infowindow, 'domready', function()
{
    activatecheckbox("0002") 
})

因此,当dom准备就绪时,会激活两次activatecheckbox(每个事件监听器一次)。