2010-05-23 5 views
1

Quelqu'un at-il une idée de la façon dont ce code google fonctionne?jquery google link

j'ai obtenu les éléments suivants:

<!DOCTYPE html PUBLIC "-//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> 
    <title>My Google AJAX Search API Application</title> 
    <script src="http://www.google.com/jsapi?key=blahblahblah" type="text/javascript"></script> 
    <script language="Javascript" type="text/javascript"> 
    google.load("jquery", "1"); 
    google.load("jqueryui", "1"); 
    </script> 
    </head> 
    <body> 
    <div class="ui-state-highlight"> 
    hello world 
    </div> 
    </body> 
</html> 

Cependant, la <div></div> devrait afficher la boîte d'erreur avec Bonjour tout le monde. mais il ne montre pas le fond rouge à cet effet le ui ne fonctionne pas ...

Qu'ai-je fait mal ici?

Répondre

5

Vous devez également la feuille de style si vous voulez un style, comme ceci: (! Assurez-vous aussi mettre à jour le numéro de version)

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"> 

C'est la base (gris) thème, there are others

À moins que vous besoin google.load pour d'autres choses, vous pouvez inclure les scripts directement, il vaut la peine de regarder this question pour les avantages/inconvénients à utiliser google.load().

les charger directement se ressembler à ceci:

<link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css"> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/jquery-ui.min.js"></script> 
+0

Thanx qui fait un enfer de beaucoup de sens :) contrairement page googles ... pourriez-vous me aider à trouver l'emplacement pour l'ui? de jquery car il n'y avait que le core jquery là ... Puis-je ne pas mettre les dernières? Au lieu du numéro de version ou quelque chose comme ça, je l'ai déjà vu :) – Val

+0

@Val -Google a une page ici: http://code.google.com/apis/ajaxlibs/ pour la dernière, vous pouvez simplement mettre '/1/'au lieu de'/1.4.2/'pour la dernière version 1, ou'/1.4/'pour la dernière version 1.4.x, est-ce logique? –

+0

il n'est pas forcément bon d'utiliser le dernier mis à jour, certaines de vos choses peuvent casser. Personnellement, j'aime utiliser seulement 1.8.1 puis je vais mettre à jour quand et si nécessaire. – Derek

0

Bonjour tout le monde doit être affiché, mais parce que la classe ui-état-hightlight est introuvable, bonjour le monde apparaît comme le texte brut.

0

Il fonctionne à l'aide <link rel="stylesheet" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.1/themes/base/jquery-ui.css">

Vous pouvez également rouler votre propre style ici

http://jqueryui.com/themeroller/