0
votes

Bouton Event ne fonctionne pas à l'intérieur de Bootstrap Modal

J'essaie d'attraper le bouton Cliquez sur l'événement à l'intérieur modal. Mais cela ne fonctionne pas.
Est-ce que je manque quelque chose?

Voici la partie de la tête du fichier HTML. J'utilise django. P> xxx pré>

voici la partie du corps de HTML. P> xxx pré>

C'est un fichier JavaScript (index. JS). P>

$(function(){
    $("#email-signup").on("click", function(event){
        alert("hello");
    });
});


5 commentaires

Qu'essayez-vous pouvez-vous partager le code des extraits?


est la peau modale et le spectacle? ou créé de manière dynamique?


@Tevikhazarian Ça ne fait que cacher et montrer.


Où dans votre HTML joint votre fichier JavaScript?


@Shizukura j'ai ajouté la partie de la tête. Pouvez-vous vérifier s'il vous plaît?


3 Réponses :


0
votes

Je pense qu'il y a quelque chose qui ne va pas avec l'arrangement de vos scripts dans le partie

Vous pouvez essayer l'une des options suivantes:

Modifier ceci: xxx

à ceci: xxx

de cette façon, votre script sera le premier à lire avant tout autre bac à lire.


6 commentaires

Il suffit de commenter si cela ne fonctionne pas, je vais mettre à jour ma réponse


Merci pour votre commentaire. Mais cela ne fonctionne toujours pas.


C'est bizarre, ça marche sur moi. Y a-t-il une sortie dans votre console lorsque vous cliquez dessus?


À la console, je peux voir que cela invoque "non à effet RéférenceError: $ n'est pas défini à index.js: erreur 9"


C'est donc où le problème est, pouvez-vous montrer à l'intérieur index.js ?


C'est comme écrit dans le contenu ci-dessus de la mienne. Je pense que la console d'erreur se produit car "index.js" est chargé avant JQuery CDN, ce qui signifie que $ syntaxe ne peut pas être interprété.



0
votes

Maintenant que j'écris le code JS ci-dessus séparément dans HTML, cela fonctionne bien.
Donc, je suppose qu'il doit y avoir un problème sur la connexion entre le fichier JS et le fichier HTML.
Je vais essayer de le comprendre.

{% load static %}
<!DOCTYPE html>
<html lang="en">
<head>
    <title>Website</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
    <script src="{% static 'index.js' %}" type="text/javascript"></script>
    <script>
        $(function(){
            $("#email-signup").on("click", function(event){
                alert("hello");
            });
        });
    </script>
    <link href="{% static 'style.css' %}" rel="stylesheet">
</head>


1 commentaires

Le problème était que Chrome tenait la version passée du fichier JS bien qu'il ait été modifié. Je l'ai compris à partir de ce QNA. ( Stackoverflow.com/questions/ 15641474 / ... )



0
votes

Si d'élément généré de manière dynamique , vous essayez ci-dessous le type de méthode de clic. XXX


0 commentaires