当用户点击任何infoWindow中的复选框时,我该如何采取行动?

时间:2015-03-18 02:21:31

标签: javascript jquery html css google-maps

我可以在常规网页上按照此论坛中的示例进行操作。

但是当用户检查或取消选中(点击或更改)25个infoWindows中的任何一个上的复选框时尝试采取行动...无法找出任何选择器以使其工作...

完整的测试页:http://mosttraveledpeople.com/beach/maps2.php

//
// latest test code (based on research in  this forum)

     $(document).ready(function(){
        $('input[type=checkbox]').click(function(){
          if($(this).is(':checked')){
           // alert($(this).attr('id'));  
              alert ("checked");
         }   
        else {alert("unchecked");}
         });
       });



//

         var markers = [];

        myLatlng=new google.maps.LatLng("-4.293099","55.699843");
        var marker = new google.maps.Marker(
            {icon:'http://mosttraveledpeople.com/beach/beachicon_red32.png',
         position: myLatlng,
         map: map,
           title: 'Anse Lazio, Praslin Island, Seychelles',
         events:
             {
            mouseout: function(){ infoWindo.close(); }
           } 
        } 
      );

             var infoWindowContent = "<table border='0' style='background-color: white'><tr><td><img src='http://media-cdn.tripadvisor.com/media/photo-s/05/76/76/ab/anse-lazio.jpg' height='80'></td><td>Anse Lazio, Praslin Island, Seychelles<br><form id='upbeach6' name='upbeach6' action='#' method='post' onSubmit='return false;'><input type='hidden' name='beachid' value='6'>Visited: <input type='checkbox' name='flag6' id='flag6' value='Y'></input></form></td></tr></table?>";
             addInfoWindow(marker, infoWindowContent);
             markers.push(marker);

2 个答案:

答案 0 :(得分:0)

看起来你需要在地图加载后调用第一块代码,但是在选择器选择任何东西之前调用它(因为它还没有渲染)

您现在有一个mouseout事件 - 为什么不为鼠标悬停添加事件,在该事件上您可以使用jquery选择器来查看该信息框中的复选框。

或者在创建标记后,您可以执行以下操作:

  google.maps.event.addListener(marker, 'mouseover', function() {
    $(document).ready(function(){
    $('input[type=checkbox]').click(function(){
      if($(this).is(':checked')){
       // alert($(this).attr('id'));  
          alert ("checked");
     }   
    else {alert("unchecked");}
     });
   });
  });
祝你好运 -Mike

答案 1 :(得分:0)

复选框仅在打开infowindow后附加到DOM。您有两种选择:

  1. 使用infowindow中HTML中定义的onclick函数:

    var infoWindowContent = "<table border='0' style='background-color: white'><tr><td><img src='http://media-cdn.tripadvisor.com/media/photo-s/05/76/76/ab/anse-lazio.jpg' height='80'></td><td>Anse Lazio, Praslin Island, Seychelles<br><form id='upbeach6' name='upbeach6' action='#' method='post' onSubmit='return false;'><input type='hidden' name='beachid' value='6'>Visited: <input type='checkbox' name='flag6' id='flag6' value='Y' onclick='alert(\'foo\');'></input></form></td></tr></table?>";
    
    1. 使用JQuery在infowindow附加到DOM之后,在infowindow上的domready事件侦听器中添加侦听器。