suchen

Heim >Web-Frontend >js-Tutorial >Warum funktioniert das Klickereignis für die Popup-Schaltfläche meiner Chrome-Erweiterung nicht?

Warum funktioniert das Klickereignis für die Popup-Schaltfläche meiner Chrome-Erweiterung nicht?

Patricia Arquette
Patricia ArquetteOriginal
2024-11-25 18:19:11593Durchsuche

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

Fehlerbehebung bei Erweiterungs-Popups mit deaktivierten Klickereignissen

Bei der Entwicklung von Chrome-Erweiterungen kann es vorkommen, dass das Popup nicht reagiert oder Mausklickereignisse auftreten werden nicht behandelt. Dieses Problem kann dazu führen, dass die Erweiterung nicht ordnungsgemäß funktioniert.

Problembeschreibung:

Ein Benutzer hat ein Chrome-Erweiterungs-Popup erstellt, das eine Schaltfläche zum Erhöhen einer Variablen beim Klicken enthält. Das Klicken auf die Schaltfläche löst jedoch nicht das erwartete Verhalten beim Erhöhen der Variablen aus. Die manifest.json-Datei und der HTML-Seitencode für das Popup werden bereitgestellt:

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"
  }
}

hello.html (Popup Seite):

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

Untersuchung:

Die Untersuchung ergab, dass das Problem auf die von Chrome durchgesetzte standardmäßige Content Security Policy (CSP) zurückzuführen ist. Der CSP verbietet die Inline-JavaScript-Ausführung, die in der Popup-HTML-Seite zur Verarbeitung des Klickereignisses verwendet wird.

Lösung:

Um das Problem zu beheben, muss das Inline-JavaScript von Die HTML-Datei wird entfernt und in einer separaten JS-Datei abgelegt:

hello.html (Popup Seite):

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

popup.js:

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

Mit dieser Änderung erhöht das Popup nun die Variable wie erwartet, wenn die Schaltfläche gedrückt wird angeklickt wird.

Das obige ist der detaillierte Inhalt vonWarum funktioniert das Klickereignis für die Popup-Schaltfläche meiner Chrome-Erweiterung nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

JavaScript json chrome html for Event JS default this issue
Stellungnahme：
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel：Warum ng-bind anstelle von {{}}-Interpolation in AngularJS wählen?Nächster Artikel：Warum ng-bind anstelle von {{}}-Interpolation in AngularJS wählen?

In Verbindung stehende Artikel

Mehr sehen