google maps charge jQuery

Je veux charger un fichier Google Maps avec le jQuery la logique est très simple, je veux que la page est rechargée à chaque fois que j'envoie une nouvelle variable à la requête ...google maps charge jQuery

la problème est le contenu ne se charge pas ..

est ici le JavaScript code ....

<script type="text/javascript"> 
$(document).ready(function(){ 
function Display_Load() 
{ 
    $("#loading").fadeIn(900,0); 
    $("#loading").html("<img src='img/bigLoader.gif' style='border:none;' />"); 
} 
//Hide Loading Image 
function Hide_Load() 
{ 
    $("#loading").fadeOut('slow'); 
}; 
$("#pagination li").click(function(){ 
Display_Load(); 
$("#content").load("file_map.php", Hide_Load()); 
} 
}); 
</script>

et ici le code html

<body> 
<div id="loading" ></div> 
<div id="content" ></div> 
    </body>

cette exemple est bien travailler avec un autre fichier php ou html mais juste toujours pas avec Google Maps, je pense que le problème est sur la fonction initialize() sur le chargement de la page, mais je n » sais comment résoudre s'il vous plaît qui peut me aider

th'x beaucoup

Source

2012-01-03 Boumaili

il y a une erreur dans votre code JavaScript, vous n'avez pas terminé l'appel click (ou l'appel ready; la nature des erreurs de syntaxe signifie que nous ne savons pas vraiment laquelle est incomplète). Donc, aucun code n'est en cours d'exécution et vous devriez voir une erreur de syntaxe dans la console JavaScript. L'utilisation d'une indentation appropriée peut vous aider à attraper des erreurs, cela vaut la peine de prendre l'habitude de le faire. Voici une version bien-dentelée de votre code:

<script type="text/javascript"> 
$(document).ready(function(){ 
    function Display_Load() 
    { 
     $("#loading").fadeIn(900,0); 
     $("#loading").html("<img src='img/bigLoader.gif' style='border:none;' />"); 
    } 
    //Hide Loading Image 
    function Hide_Load() 
    { 
     $("#loading").fadeOut('slow'); 
    }; 
    $("#pagination li").click(function(){ 
     Display_Load(); 
     $("#content").load("file_map.php", Hide_Load()); 
    } 
}); 
</script>

Comme vous pouvez le (maintenant) voir, vous manquez le ); le deuxième à la dernière ligne pour terminer l'appel click.

Une fois que vous correctif, séparément il y a une erreur sur cette ligne:

$("#content").load("file_map.php", Hide_Load()); 
//        here -----^^

Tout comme tout autre appel de fonction, il vous êtes appelantHide_Load et passer sa valeur de retour dans load. Si vous voulez Hide_Load être le rappel d'achèvement, vous ne voulez pas appel, vous voulez juste passer la référence de la fonction — fossé le ():

$("#content").load("file_map.php", Hide_Load);

Avec le (), il est comme vous » appelez $("#content").load("file_map.php", undefined); car le résultat d'un appel de fonction à une fonction qui n'utilise pas return est undefined.

Source

2012-01-03 15:03:33

j'ai essayer de ne pas utiliser la fonction Hide_Load(), mais même bug apparaissent toujours – Boumaili

@Boumaili: Il y a une autre question que je l'ai mentionné dans la réponse; vous devez avoir lu une version périmée de la réponse. –

Voici le contenu d'un fichier de google maps exemple file_map.php .....

<?php include_once($_SERVER['DOCUMENT_ROOT'] . "/config.php"); 
require_once($lib_path."mysql.class.php"); 
require_once($lib_path."document.php"); 
require_once $lib_path . "userAccount.php"; 
require_once($lib_path."adsearch_class.php"); 
?> 


<!DOCTYPE html "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
    <head> 
    <meta http-equiv="content-type" content="text/html; charset=utf-8"/> 
    <script src="http://maps.google.com/maps?file=api&amp;v=2&amp;key=------------------------------------" type="text/javascript"></script> 

<script type="text/javascript"> 

function initialize() { 
    if (GBrowserIsCompatible()) { 
    var map = new GMap2(document.getElementById("map_canvas")); 
    map.setCenter(new GLatLng(37.4419, -122.1419), 13); 
    map.setUIToDefault(); 
    } 
} 

</script> 


</head> 
    <body onload="initialize()" onunload="GUnload()"> 
    <div id="map_canvas" style="width: 500px; height: 300px"></div> 
    </body> 
</html>

ce fichier est bien fonctionne sans jQuery ... mais aucun résultat quand je l'appelle avec le jQuery ..

l'index.fichier php est ici

<?php 
include_once($_SERVER['DOCUMENT_ROOT'] . "/config.php"); 
require_once($lib_path."mysql.class.php"); 
require_once($lib_path."document.php"); 
require_once $lib_path . "userAccount.php"; 
require_once($lib_path."adsearch_class.php"); 

$per_page = 5; 

//getting number of rows and calculating no of pages 
$rsd=new db_publish; 
$rsd->connect(); 
$sql = "SELECT *FROM `table` LIMIT 0 , 30"; 
$rsd->query($sql); 
$counteur = $rsd->count(); 
$pages = ceil($counteur/$per_page); 
?> 


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/ 
libs/jquery/1.3.0/jquery.min.js"></script> 
    <script type="text/javascript"> 

    $(document).ready(function(){ 

    //Display Loading Image 
    function Display_Load() 
    { 
     $("#loading").fadeIn(900,0); 
     $("#loading").html("<img src='img/bigLoader.gif' />"); 
    } 
    //Hide Loading Image 
    function Hide_Load() 
    { 
     $("#loading").fadeOut('slow'); 
    }; 


    //Default Starting Page Results 

    $("#pagination li:first").css({'color' : '#FF0084'}).css({'border' : 'none'}); 

    Display_Load(); 

    $("#content").load("file_map.php"); 



    //Pagination Click 
    $("#pagination li").click(function(){ 

     Display_Load(); 

     //CSS Styles 
     $("#pagination li") 
     .css({'border' : 'solid #dddddd 1px'}) 
     .css({'color' : '#0063DC'}); 

     $(this) 
     .css({'color' : '#FF0084'}) 
     .css({'border' : 'none'}); 

     //Loading Data 
     var pageNum = this.("#pagination li").id; 

     $("#content").load("file_map.php?page=" + pageNum); 
    }); 


}); 
    </script> 

<style> 
body { margin: 0; padding: 0; font-family:Verdana; font-size:15px } 
a 
{ 
text-decoration:none; 
color:#B2b2b2; 

} 

a:hover 
{ 

color:#DF3D82; 
text-decoration:underline; 

} 
#loading { 
width: 100%; 
position: absolute; 
} 

#pagination 
{ 
text-align:center; 
margin-left:120px; 

} 
li{ 
list-style: none; 
float: left; 
margin-right: 16px; 
padding:5px; 
border:solid 1px #dddddd; 
color:#0063DC; 
} 
li:hover 
{ 
color:#FF0084; 
cursor: pointer; 
} 


</style> 


    <div align="center"> 


    <div id="loading" ></div> 
    <div id="content" ></div> 


    <table width="800px"> 
    <tr><Td> 
      <ul id="pagination"> 
       <?php 
       //Show page links 
       for($i=1; $i<=$pages; $i++) 
       { 
        echo '<li id="'.$i.'">'.$i.'</li>'; 
       } 
       ?> 
    </ul> 
    </Td></tr></table> 
    </div>

comme je vous le dis sur la première fois est bien travailler exemple juste google maps le contenu ne peut pas charger .... sur la page de résultat que je viens

<div id="map_canvas" style="width: 500px; height: 300px"></div>

sans que le contenu de cartes à l'intérieur

Source

2012-01-04 10:42:26 Boumaili

google maps charge jQuery

Répondre

Questions connexes