suchen

Heim >Web-Frontend >js-Tutorial >Warum funktioniert meine Inline-Onclick-Funktion in einer Chrome/Firefox-Erweiterung nicht?

Warum funktioniert meine Inline-Onclick-Funktion in einer Chrome/Firefox-Erweiterung nicht?

DDD
DDDOriginal
2024-12-28 10:09:15170Durchsuche

Why Doesn't My Inline onclick Function Work in a Chrome/Firefox Extension?

onclick oder Inline-Skript in der Erweiterung funktioniert nicht

Problem:

in der Erweiterung, Die onClick-Funktion führt ihre beabsichtigte Funktion nicht aus, obwohl sie in Standardbrowsern einwandfrei funktioniert.

Codebeispiel:

function hellYeah(text) {
  document.getElementById("text-holder").innerHTML = text;
}
<!doctype html>
<html>
  <head>
    <title>Getting Started Extension's Popup</title>
    <script src="popup.js"></script>
  </head>
  <body>
    <div>

Wenn der Benutzer auf „hyhy“ klickt, sollte sich „ha“ in „xxx“ ändern, in der Erweiterung jedoch funktioniert nicht.

Antwort:

Chrome-Erweiterungen und Firefox WebExtensions erlauben kein Inline-JavaScript. Daher müssen Sie andere Methoden zum Binden von Ereignissen verwenden.

Eine Möglichkeit besteht darin, dem Link eine ID zuzuweisen (z. B. ) und das Ereignis mithilfe von addEventListener in der Datei popup.js zu binden: 

document.addEventListener('DOMContentLoaded', function() {
    var link = document.getElementById('link');
    // 点击逻辑如下：
    link.addEventListener('click', function() {
        hellYeah('xxx');
    });
});

Stellen Sie sicher, dass Popup angezeigt wird .js Als separate Skriptdatei geladen: 

<script src="popup.js"></script>

Das obige ist der detaillierte Inhalt vonWarum funktioniert meine Inline-Onclick-Funktion in einer Chrome/Firefox-Erweiterung nicht?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

JavaScript firefox chrome JS function 事件
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 führt die Kombination der Flags „g“ und „i“ in JavaScripts RegExp zu unerwarteten Ergebnissen?Nächster Artikel：Warum führt die Kombination der Flags „g“ und „i“ in JavaScripts RegExp zu unerwarteten Ergebnissen?

In Verbindung stehende Artikel

Mehr sehen