$(selector).live('click', function(){ }); acting as a double click, why?
I've been trying to tackle this problem for a day and half now and I can't seem to figure out this strange behavior.
When I do that live.('click' fn) it behaves like a double click. Well no that's not the true, what happens is that if I click on it once it performs on action, then when I click on it again it files off the second action. Shouldn't a single click fire all the actions within the click function? And also tried the simple $.click(fn) but that didn't even work at all for a single click.
here is my code in quetion:
$('#details #map-home').live('click', function(){
var name = $('#dFname').text();
///////////////////////////////////////////////////////////////////
////////// Google Maps API Functions //////////////////////////////
$(this).bind('cbox_complete', function(){
var geocoder;
var map;
var a = $("span#address").text() + $("span#city").text() + $("span#state").text() + $("span#zip").text();
//var image = 'http://code.google.com/apis/maps/documentation/javascript/examples/images/beachflag.png';
var div =
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(37.0625, -95.677068);
var myOptions = {
zoom: 19,
center: lat开发者_JAVA百科lng,
disableDefaultUI: true,
mapTypeId: google.maps.MapTypeId.HYBRID
}
map = new google.maps.Map(document.getElementById("map"), myOptions);
geocoder.geocode( { 'address': a}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var infowindow = new google.maps.InfoWindow({
content: a
});
var marker = new google.maps.Marker({
map: map,
//draggable: true,
//icon: image,
position: results[0].geometry.location
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map, this);
});
infowindow.open(map, marker);
} else {
console.log("Geocode was not successful for the following reason: " + status);
}
});
});
///////////////////////////////////////////////////////////////////
$(this).colorbox({
width:"650",
inline: true,
href:"#map",
overlayClose: false
});
//$('#colorbox').draggable();
return false
});
any ideas?
I don't think using live here makes sense as you are dealing with a unique element with an id so I changed it to click instead. Also moved the bind to cbox_complete out of your click function as this is probably in line with expected behaviour. Also removed some strange code. Try the below.
$("#map-home").bind('cbox_complete', function(){
var geocoder;
var map;
var a = $("span#address").text() + $("span#city").text() + $("span#state").text() + $("span#zip").text();
geocoder = new google.maps.Geocoder();
var latlng = new google.maps.LatLng(37.0625, -95.677068);
var myOptions = {
zoom: 19,
center: latlng,
disableDefaultUI: true,
mapTypeId: google.maps.MapTypeId.HYBRID
}
map = new google.maps.Map(document.getElementById("map"), myOptions);
geocoder.geocode( { 'address': a}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
map.setCenter(results[0].geometry.location);
var infowindow = new google.maps.InfoWindow({
content: a
});
var marker = new google.maps.Marker({
map: map,
position: results[0].geometry.location
});
google.maps.event.addListener(marker, 'click', function() {
infowindow.open(map, this);
});
infowindow.open(map, marker);
} else {
console.log("Geocode was not successful for the following reason: " + status);
}
});
});
$("#map-home").click(function(){
$(this).colorbox({
width:"650",
inline: true,
href:"#map",
overlayClose: false
});
});
精彩评论