Javascript 当复选框的容器也包含任何图像时,复选框将触发事件两次
我的网站上有一张谷歌地图。单击相应的标记时,每个信息窗口都会打开,并包含一个带有单个id的复选框。选中该复选框时,将触发一条控制台消息。代码如下:Javascript 当复选框的容器也包含任何图像时,复选框将触发事件两次,javascript,jquery,google-maps,jquery-tabs,Javascript,Jquery,Google Maps,Jquery Tabs,我的网站上有一张谷歌地图。单击相应的标记时,每个信息窗口都会打开,并包含一个带有单个id的复选框。选中该复选框时,将触发一条控制台消息。代码如下: function initialize() { var mapOptions = { center: new google.maps.LatLng(-34.600, -58.400), zoom: 12, mapTypeId: google.maps.MapTypeId.ROADMA
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")
})
}
函数初始化()
{
变量映射选项=
{
中心:新google.maps.LatLng(-34.600,-58.400),
缩放:12,
mapTypeId:google.maps.mapTypeId.ROADMAP,
minZoom:12,
滚轮:错误,
};
var map=new google.maps.map(document.getElementById(“map_canvas”),mapOptions);
var point1=new google.maps.LatLng(-34.600,-58.400)
dot0001=新的google.maps.Marker(
{
位置:第1点,
地图:地图,
})
var point2=新的google.maps.LatLng(-34.620,-58.400)
dot0002=新的google.maps.Marker(
{
位置:第2点,
地图:地图,
})
var infowindow=new google.maps.infowindow({});
函数填充信息窗口(标记名、数字代码、对象)
{
infowindow.open(地图、标记名)
infowindow.setContent(
''+
“”+
“
”+
''+
''+
''+
''+
''+
''+
'')
}
函数activatecheckbox(数字代码)
{
$(“#tabsinfo”+numbercode.tabs();
$('#checkboxinfo'+numbercode).change(函数()
{
if($('#checkboxinfo'+numbercode).is(':checked'))
{
console.log(“checkboxtest”)
}
})
}
google.maps.event.addListener(dot0001,'click',function()
{
填写信息窗口(点0001,“0001”)
})
google.maps.event.addListener(dot0002,'click',function()
{
填写信息窗口(dot0002,“0002”)
})
google.maps.event.addListener(infowindow,'domready',function()
{
激活TechKBox(“0001”)
})
google.maps.event.addListener(infowindow,'domready',function()
{
激活TechKBox(“0002”)
})
}
问题是:选中复选框时,控制台消息会触发两次
这里有一件奇怪的事情:当我加载网页时,没有标签2中的图像,控制台消息只会触发一次,就像它应该的那样。不幸的是,这些图片是我网站的重要组成部分
对我来说,这毫无意义
感谢任何帮助在我看来,您有两个“domready”事件侦听器
1) google.maps.event.addListener(infowindow, 'domready', function()
{
activatecheckbox("0001")
})
2) google.maps.event.addListener(infowindow, 'domready', function()
{
activatecheckbox("0002")
})
因此,当dom就绪时,将触发activatecheckbox两次(每个事件侦听器一次)。在我看来,您有两个“domready”事件侦听器
1) google.maps.event.addListener(infowindow, 'domready', function()
{
activatecheckbox("0001")
})
2) google.maps.event.addListener(infowindow, 'domready', function()
{
activatecheckbox("0002")
})
因此,当dom就绪时,将触发activatecheckbox两次(每个事件侦听器一次).建议您使用正确的格式,并使用分号表示语句的结尾。建议您使用正确的格式,并使用分号表示语句的结尾。我添加了另一个标记和另一个相应的函数。如果您是对的,那么现在应该有3条控制台消息,对吗?恐怕没有。我添加了另一个标记和另一个相应的功能。如果您是对的,那么现在应该有3条控制台消息,对吗?恐怕没有。