11548 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

J'ai un problème de validation W3 du fait que j'utilise :
<form action="http://www.google.com/search" name="google_suggest">

Ça me dit "Attribute "name" exists, but can not be used for this element."

J'ai donc adapté mon code HTML en fonction avec:
<form action="http://www.google.com/search" id="google_suggest" 


Seulement le code Javascript ne fonctionne plus (il permet d'afficher des suggestions de recherche Google).
Le Javascript est dispo ici http://jabe64.free.fr/scripts/script.js, c'est à la fin du script:

window.google={kEI:"wR-4SfmNIMyA-AbluKj5Cg",kEXPI:"17259,17291,18169",kHL:"fr"};
var _gjwl=location;function _gjuc(){var a=_gjwl.hash.substring(1);if(/(^|&)q=/.test(a)&&a.indexOf("#")==-1&&!/(^|&)cad=h($|&)/.test(a)){_gjwl.replace("search?"+a.replace(/(^|&)fp=[^&]*/g,"")+"&cad=h");return 1}return 0};
window._gjuc && location.hash && _gjuc();



google.y={};google.x=function(e,g){google.y[e.id]=[e,g];return false};window.clk=function(b,c,d,e,f,g,h){if(document.images){var a=encodeURIComponent||escape;(new Image).src=["/url?sa=T",c?"&oi="+a(c):"",d?"&cad="+a(d):"","&ct=",a(e),"&cd=",a(f),b?"&url="+a(b.replace(/#.*/,"")).replace(/\+/g,"%2B"):"","&ei=wR-4SfmNIMyA-AbluKj5Cg",g].join("")}return true};
window.gbar={qs:function(){},tg:function(e){var o={id:'gbar'};for(i in e)o[i]=e[i];google.x(o,function(){gbar.tg(o)})}};



if(google.y)google.y.first=[];
window.setTimeout(function(){var xjs=document.createElement('script');
xjs.src='http://www.google.com/extern_js/f/CgJmciswCjgNLCswDjgELCswFjgELCswFzgBLCswGDgDLCswJTjJiAEsKzAnOAAs/4Pb8ykSjyRQ.js';
document.getElementsByTagName('head')[0].appendChild(xjs)},0);
google.y.first.push(function(){google.ac.i(document.google_suggest,document.google_suggest.q,'','')})
function _gjp() {!(location.hash && _gjuc()) && setTimeout(_gjp, 500);}window._gjuc && _gjp();
/*


J'ai tenté de changer
document.google_suggest,document.google_suggest.q

en plaçant des
getElementById("google_suggest")
mais ça ne passe pas non plus.

J'attends vos suggestions Smiley cligne [/i][/i]
Modifié par Jabe (10 May 2009 - 19:18)
Salut Jabe,

La ligne en question, une fois indentée correctement, ressemble à ça :
google.y.first.push(
    function(){
        google.ac.i(
            document.google_suggest,
            document.google_suggest.q,
            '',
            ''
        )
    }
)
Perso je ne suis pas certain du type de la valeur renvoyée par document.elementNommé. Comme en plus le code de Google est ultra-minifié, c'est pas super facile de s'y retrouver. Voyons : quels message d'erreur te renvoit la console Javascript avec ça :
google.y.first.push(
    function(){
        var google_suggest = document.getElementById('google_suggest');
        google.ac.i(
            google_suggest,
            google_suggest.q,
            '',
            ''
        )
    }
)
et avec ça :
google.y.first.push(
    function(){
        var google_suggest = [document.getElementById('google_suggest')];
        google.ac.i(
            google_suggest[0],
            google_suggest[0].q,
            '',
            ''
        )
    }
)
Merci beaucoup pour cette réponse rapide ça fonctionne avec les 2 Smiley biggrin .

Mais visiblement depuis que j'ai rajouté un script pour afficher la météo et les actualités il y a un conflit et la console d'erreur me rajoute:
Erreur : google_suggest is null
Et les suggestions ne s'affichent plus.

Quand j'enlève les scripts météo et actualités ça fonctionne à nouveau (avec id ou avec name je n'avais pas fait attention mais ça le faisait avant).

Les scripts sont dispos sur:
http://www.publo.fr/javascript/publo_meteo.js
http://www.publo.fr/javascript/publo_actualite.js


(J'hésite à créer un autre sujet, vu que mon le problème de form name en form id est résolu)

Il y aussi l'erreur:
a écrit :
[Exception... "'Syntax error, unrecognized expression: [@type=text]' when calling method: [nsIDOMEventListener::handleEvent]" nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "<unknown>" data: no]

Mais ça je pense que ça vient d'un autre script que j'utilise pour enlever le texte prérempli lors du focus, mais je n'ai pas fini les retouches de cette partie donc c'est normal.

[Hors Sujet] Je suis à la recherche d'un outil permettant de rendre le code HTML, CSS, JavaScript, etc. lisible en un clic…

Par exemple sous Dreamweaver en sélectionnant du code puis en faisant clic droit puis Sélection il y a des outils comme "convertir les balises en minuscules".
Existe-t-il le même système mais pour aérer son code ?

Firebug sous Firefox lit correctement le code mais je n'arrive pas à l'exporter avec les espaces.
Ce serait utile pour mieux lire le code de Google comme tu l'as fait marcv.
[Fin du Hors Sujet]
a écrit :
ça fonctionne avec les 2
Je suis doublement surpris:
1. tu disais avoir déjà essayé sans succès avec getElementById(). C'est pourtant la première des deux solutions que je t'ai données.
2. ça veut dire que la fonction google.ac.i() accepte en premier argument aussi bien un élément seul qu'un tableau d'éléments. Bon, ok...
a écrit :
J'hésite à créer un autre sujet, vu que mon le problème de form name en form id est résolu
En effet, je crois que c'est plus clean de créer un autre sujet. C'est d'ailleurs ce que je t'encourage à faire si jamais ma réponse ci-dessous ne résoud pas ton problème.
a écrit :
Erreur : google_suggest is null
Si le script ne trouve pas #google_suggest (qui est pourtant en dur dans le HTML) c'est vraisemblablement qu'il (le script) s'exécute avant que le DOM soit prêt. Solution rapide : forcer le script de Google à attendre la fin du chargement du DOM pour s'éxecuter => place le script dans ton $(document).ready()
a écrit :
Je suis à la recherche d'un outil permettant de rendre le code HTML, CSS, JavaScript, etc. lisible en un clic…
JSBeautifier, par exemple.
a écrit :
1. tu disais avoir déjà essayé sans succès avec getElementById(). C'est pourtant la première des deux solutions que je t'ai données.


C'est de ma faute, j'avais bien testé avec getElementById() mais entre-temps j'avais rajouté le script metéo et actualités et je n'avais pas vu qu'ils créaient un conflit.

Du coup je pensais que ça ne fonctionnait pas à cause de getElementById() alors qu'en fait même avec "name" ça ne fonctionnait plus.

a écrit :
Solution rapide : forcer le script de Google à attendre la fin du chargement du DOM pour s'éxecuter => place le script dans ton $(document).ready()


Un grand MERCI Smiley biggrin pas besoin de créer de sujet ça a résolu mon problème aussi.

a écrit :
JSBeautifier, par exemple.


Oui c'est exactement ça que je cherchais et en tapant HTML ou CSS Beautifier j'en ai trouvé d'autres, c'était ce mot-clé "Beautifier" qui me manquait.

J'édite de ce pas en résolu… Encore merci Smiley cligne !
Bonjour,

Jabe a écrit :

Mais visiblement depuis que j'ai rajouté un script pour afficher la météo et les actualités il y a un conflit et la console d'erreur me rajoute:
Erreur : google_suggest is null
Et les suggestions ne s'affichent plus.


le 'null' après un getElementById (ou autre recherche sur le DOM) survient fréquemment quand la recherche est effectuée avant que l'élément en question ait été ajouté dans le DOM.
Êtes-vous sûr que ce n'est pas la cause de ce problème ?

<puristes-ne-lisez-pas-cette-parenthese-svp>
(pour le vérifier de façon simple mais un peu sale, il suffit de mettre l'élément <javascript> correspondant à votre script tout à la fin de votre document HTML, juste avant le </body>).
</puristes-ne-lisez-pas-cette-parenthèse-svp>
Merci pour cette réponse benb mais mon problème est résolu (comme je l'ai noté).

Pour l'erreur "google_suggest is null" je l'ai corrigée en suivant le conseil de marcv:

a écrit :
Solution rapide : forcer le script de Google à attendre la fin du chargement du DOM pour s'éxecuter => place le script dans ton $(document).ready()


Je n'ai donc plus de problème dans la console d'erreurs Smiley smile .

Ni même celui du texte prérempli que j'ai corrigé même s'il me reste à rajouter un changement de texte selon le bouton radio coché (je posterais peut-être un sujet sur ça si je ne trouve pas comment faire).

[Hors Sujet]
Il me reste un problème de positionnement CSS comme je l'explique dans ce sujet:
http://forum.alsacreations.com/topic-4-41708-1-Positionnement-OK-en-1024-mais-pas-au-dessus-ni-en-dessous.html

Mais je vais refaire ma mise en page autrement avec des boîtes flottantes à taille fixe pour les boutons radio de façon à ce qu'ils reviennent à la ligne avec le texte rattaché et donc qu'ils ne soient pas séparés sur certaines résolutions comme c'est le cas actuellement.

Je verrais si le fait de faire ça me fait avancer sur mon problème de boîte jaune.
[/Hors Sujet]
Ok pour le "google_suggest null"
Par contre, avez-vous toujours un pb de cohabitation entre le script google_suggest et les scripts meteo/actualités ?
Si c'est le cas, le pb m'intéresse beaucoup puisque j'assure la maintenance de ces scripts Smiley smile
Je réponds une dernière fois ici, mais il vaut mieux continuer notre conversation par mp car ça part en hors sujet…

Non pas de problème de cohabitation entre ces scripts comme vous pouvez le voir en tapant quelque chose dans la barre Google de http://jabe64.free.fr/r.

Par contre je remarque souvent (et encore aujourd'hui) que la météo et les actualités ne s'affichent pas car le site (publo.fr) est parfois saturé ou hors service.

Du coup je vais peut-être changer de système pour héberger les scripts moi-même…

(Au passage j'avais envoyé un mail en mars pour avoir une clé d'utilisation du script et je n'ai jamais eu de réponse…)

Je me pose une question également sur ces scripts, que se passe-t-il si on est à l'étranger ?
(J'ai tenté de passer par un proxy pour voir ce que ça donnerait mais ça n'a pas fonctionné.)

Est-ce que les actualités locales et la météo fonctionnent encore ?
Il serait intéressant que le système s'adapte aussi à la langue du clavier de l'utilisateur pour afficher "weather" en anglais, "Wetter" en allemand, etc.

Une idée d'amélioration de ce script serait de fournir un lien
"Prévisions de TWC" comme avec Forecastfox l10n sous Firefox qui redirige vers les prévisions des 10 prochains jours (exemple: http://fr.weather.com/weather/10day-Bagneux-92220 ) ou/et de la journée heure par heure (exemple: http://fr.weather.com/weather/hourByHour-Bagneux-92220 )

Ou mieux encore, que ça redirige vers le site de météo France pour la France (mais pas pour l'étranger bien sûr) exemple:
http://france.meteofrance.com/france/meteo?PREVISIONS_PORTLET.path=previsionsville/920070
Si ça peut aider j'ai remarqué que meteofrance utilise le code Insee de la ville auquel ils ajoutent un 0. Et on peut trouver des Code Insee par ville ici:
http://www.lion1906.com/Pages/francais/recherche/codes_insee/codes_insee.html

Pour les news il faudrait que ça change non seulement selon le lieu mais selon la langue mais là y'a encore + de boulot…

En tout cas bravo pour ce script il est vraiment très intéressant Smiley ravi .