Pourquoi mon événement de clic sur le bouton contextuel de mon extension Chrome ne fonctionne-t-il pas ?-js tutoriel-php.cn

Pourquoi mon événement de clic sur le bouton contextuel de mon extension Chrome ne fonctionne-t-il pas ?

Patricia Arquette

Libérer： 2024-11-25 18:19:11

original

609 Les gens l'ont consulté

Why is my Chrome Extension Popup Button Click Event Not Working?

Dépannage des fenêtres contextuelles d'extension avec des événements de clic désactivés

Lors du développement d'extensions Chrome, il est possible de rencontrer des situations dans lesquelles la fenêtre contextuelle ne répond pas ou des événements de clic de souris ne sont pas traités. Ce problème peut empêcher l'extension de fonctionner correctement.

Description du problème :

Un utilisateur a créé une fenêtre contextuelle d'extension Chrome qui comprend un bouton permettant d'incrémenter une variable en cas de clic. Cependant, le clic sur le bouton ne déclenche pas le comportement attendu d'incrémentation de la variable. Le fichier manifest.json et le code de la page HTML du popup sont fournis :

manifest.json :

{
  "name":"Facebook",
  "version":"1.0",
  "description":"My Facebook Profile",
  "manifest_version":2,
  "browser_action":{
    "default_icon":"google-plus-red-128.png",
    "default_popup":"hello.html"
  }
}

Copier après la connexion

hello.html (Popup Page):

<!DOCTYPE html>
<html>
  <head>
    <script>
      var a=0;
      function count()
      {
        a++;
        document.getElementById("demo").innerHTML=a;
        return a;
      }
    </script>
  </head>
  <body>
    <p>

Copier après la connexion

Enquête :

L'enquête révèle que le problème est dû à la politique de sécurité du contenu (CSP) par défaut appliquée par Chrome. Le CSP interdit l'exécution de JavaScript en ligne, qui est utilisé dans la page HTML contextuelle pour gérer l'événement de clic.

Solution :

Pour résoudre le problème, le JavaScript en ligne de le fichier HTML est supprimé et placé dans un fichier JS séparé :

hello.html (Popup Page):

<!DOCTYPE html>
<html>
<head>
</head>
<body>
  <p>

Copier après la connexion

popup.js:

var a=0;
function count() {
  a++;
  document.getElementById('demo').textContent = a;
}
document.getElementById('do-count').onclick = count;

Copier après la connexion

Avec ce changement, la fenêtre contextuelle incrémentera désormais la variable comme prévu lorsque le bouton est cliqué.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!