Array et bouton twitter

Pour toutes les discussions javascript, jQuery et autres frameworks
Répondre
ki_el
Messages : 4
Enregistré le : 26 mai 2020, 04:13

Array et bouton twitter

Message par ki_el » 26 mai 2020, 04:44

Bonjour/bonsoir,

je m'excuse d'avance pour l'absence d'accents dans mes phrases, mon clavier n'en contient pas...
J'ai commence javascript il y a peu(environ 1 mois), et pour m'entrainer j'ai voulu tenter de creer un generateur de citation avec un bouton twitter permettant de partager la ciation tiree au sort.
Afin de generer les citations j'ai cree une variable en array. Et par la suite utilise Math.random et Math.floor pour creer le generateur.
ce qui donne q peu pres ca :


var advice ={
'.....',
'.....',
}

function NewAdvice(){
var randomNumber = Math.floor(Math.random()*(Advice.length));

document.getElementById('AdviceGen').innerHTML=Advice[randomNumber];
}

et dans mon document html j'ai insere ce code

<div id="AdviceGen" class="center"></div>

jusque la je n'ai aucun probleme, la ou les choses se compliquent c'est lorsque j'ai voulu creer mon bouton twitter :

en code javascript ca donne ca :

document.getElementById('button2').onclick = function share(){
window.open('https://twitter.com/intent/tweet?text='+ AdviceGen +'&via=Girls','height=300 , width=550 , scrolls=0, menubar=0');
};

en entrant l'ID adviceGen j'ai une reaction : la fenetre s'ouvre bien et me met la zone de texte pour ecrire un tweet cependant au lieu de m'afficher la citation qui a ete genere par mon programme, elle affiche {DIV ELEMENT}
si je remplace AvideGen par la variable Advice , cela affiche absolument toutes les citations que j'ai entre, ce qui est logique. J'ai donc essaye avec la fonction NewAdvice dans ce cas la, je n'ai aucune reaction de la part du bouton twitter.

Je me pose donc la question suivante, est ce qu'avec un array il est impossible d'obtenir uniquement la citation qui a ete genere ?
Ou il y aurait-il une autre maniere de faire ??? :?:

Je suis vraiment desolee pour le manque d'accent qui rend la lecture de mon texte difficile, mais vivant a l'etranger, mon clavier n'est pas azerty ni dote d'accent...

je vous remercie d'avance.

Avatar du membre
webmaster
Administrateur du site
Messages : 563
Enregistré le : 28 févr. 2017, 15:19

Re: Array et bouton twitter

Message par webmaster » 26 mai 2020, 11:50

Bonjour

Interessant exercice

AdviceGen est le div
Pour avoir son contenu, il faut écrire

Code : Tout sélectionner

document.getElementById("AdviceGen").innerHTML
Je pense que cela fonctionnera, en ajoutant par précaution un encodage des espaces avec
https://www.toutjavascript.com/referenc ... ponent.php
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php

ki_el
Messages : 4
Enregistré le : 26 mai 2020, 04:13

Re: Array et bouton twitter

Message par ki_el » 26 mai 2020, 13:26

Bonjour, merci de votre reponse rapide. concernant le code : document.getElementById("AdviceGen").innerHTML
je l'avais deja integre dans mon code.

Le probleme que j'ai se situe vraiment dans le bouton twitter. Au niveau de la fonction share, comme vous pouvew le voir dans le lien qui est insere dans le window.open


window.open('https://twitter.com/intent/tweet?text='+ AdviceGen +'&via=Girls','height=300 , width=550 , scrolls=0, menubar=0');
};
c'est cette partie qui me pose probleme. En executant le bouton twitter j'obtiens une fenetre qui s'ouvre avec le contenu suivant :Image

Devrais-je vous montrer la partie script et html en entier ?

Avatar du membre
webmaster
Administrateur du site
Messages : 563
Enregistré le : 28 févr. 2017, 15:19

Re: Array et bouton twitter

Message par webmaster » 26 mai 2020, 14:27

Oui, je veux bien le code entier

Mais a mon avis, d'après l'affichage "Object HTMLDivElement" il doit manquer la partie innerHTML :
https://www.toutjavascript.com/referenc ... erhtml.php

Ca serait bien d'afficher cette partie dans la console avec console.log() pour voir ce qu'elle contient plus précisément.
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php

ki_el
Messages : 4
Enregistré le : 26 mai 2020, 04:13

Re: Array et bouton twitter

Message par ki_el » 27 mai 2020, 06:39

Bonjour, merci pour votre reponse,
je vous copie colle la partie utilisee pour le generateur de code et le code du bouton twitter.

il y a deux boutons dans mon "programme", un pour generer une citation aleatoire et un autre pour twitter.


var Advice = [
'........',
'......',
]
//1st button function//
function NewAdvice(){
var randomNumber = Math.floor(Math.random()*(Advice.length));

document.getElementById('AdviceGen').innerHTML=Advice[randomNumber];
}

et dans la partie html

<script src='script.js'>
<div id="AdviceGen" class="center"></div>





<button onclick="NewAdvice()" id="button1"> Get </button>


pour la partie twitter

en html




<button onclick="share()" id="button2"> partager sur twitter </button>

en javascript

document.getElementById('button2').onclick = function share(){
window.open('https://twitter.com/intent/tweet?text='+ AdviceGen +'&via=Girls','height=300 , width=550 , scrolls=0, menubar=0');
};


voila.

je vous remercie d'avance

Avatar du membre
webmaster
Administrateur du site
Messages : 563
Enregistré le : 28 févr. 2017, 15:19

Re: Array et bouton twitter

Message par webmaster » 27 mai 2020, 13:04

Je ne vois pas ou est définie la variable AdviceGen dans

Code : Tout sélectionner

window.open('https://twitter.com/intent/tweet?text='+ AdviceGen +'&via=Girls','height=300 , width=550 , scrolls=0, menubar=0');
Il faut la remplacer par :

Code : Tout sélectionner

window.open('https://twitter.com/intent/tweet?text='+ encodeURIComponent(document.getElementById("AdviceGen").innerHTML) +'&via=Girls','height=300 , width=550 , scrolls=0, menubar=0');
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php

ki_el
Messages : 4
Enregistré le : 26 mai 2020, 04:13

Re: Array et bouton twitter

Message par ki_el » 27 mai 2020, 13:22

Merci beaucoup de votre reponse,
effectivement ! ca a fonctionne ! Je pense avoir compris mon erreur!

Répondre