2017-10-15 3 views
0

Je suis sur CodePen, essayant de m'entraîner à utiliser JS et jQuery conjointement avec HTML.JS/jQuery ne fonctionne pas dans CodePen

HTML:

<button>asdasads</button> 

JS:

$('button').on('click', function() { 
    alert('woot'); 
}); 

Link to the pen, qui ne fonctionne pas.

Il est destiné à afficher une alerte lorsque le bouton est cliqué. Mais ça ne fait rien.

En voici un autre, avec le même HTML/JS. La seule différence est que j'ai édité ce second sur un "exemple de faire disparaître ce paragraphe en cliquant sur un bouton" exemple CodePen pen.

This CodePen pen fonctionne à 100%.

qui fonctionne très bien. Le code est identique. Qu'est-ce qui se passe ici? Je ne trouve rien sur Google, il n'y a aucune mention d'avoir à configurer CP de quelque façon que ce soit pour que votre JS se mêle à votre code HTML.

Puis encore ... Quand j'étais enfant, il y avait une pièce dans la maison de mes parents qui était en train d'être rénovée et le sol était parti, laissant une chute au sous-sol. Je jouais à l'ouverture et à la fermeture d'une porte dans la pièce, feignant d'être surpris que le sol soit parti. Jusqu'à une fois j'ai oublié et j'ai couru (oui, je suis tombé), et c'était seulement comme la 4ème fois que j'ai ouvert la porte. Donc voilà.

Merci à l'avance. C'est ma première question à poser ici. Sois gentil! : E

+0

Vous devez inclure jquery dans une bibliothèque externe. – Nick

+0

Merci, snapjs, aussi. C'était correct. –

Répondre

1

enter image description here

Vous devez ajouter la bibliothèque jQuery au stylo. Il suffit de cliquer sur l'engrenage dans le bloc JS, puis cliquez sur Quick Add, comme sur cette photo

+0

Merci. C'est non seulement correct mais aussi instructif. J'aimerais marquer ceci comme correct; cependant j'ai promis de marquer la réponse d'Indent comme la bonne. Je lui ai demandé si je pourrais choisir ceci comme étant correct à la place. Montre que je ne devrais pas être si hâtif ... :) –

+0

n'a pas d'importance .... heureux d'aider. Codage heureux –

1

Vous devez ajouter JQuery (Ajouter JavaScript externe)

https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js

+0

Votre réponse était en effet correcte, mais Pato Salazar a répondu plus complètement. J'ai dit que je marquerais ta réponse comme correcte, mais tu sais quoi? Je ne suis pas sûr de ce qu'il faut faire ici. Stackoverflow est rempli avec des commentaires sur une autre réponse méritant d'être marquée la bonne réponse. Alors que le vôtre est correct, celui ci-dessous est encore meilleur. Pourrais-je avoir la permission de marquer l'autre réponse comme correcte? –

+0

c'est bien ... ne vous inquiétez pas à ce sujet @ JaakkoPöntinen –

+0

C'est ok pour moi aussi. Vous pouvez marquer la réponse de Pato Salazar. – Indent