cari

Rumah >hujung hadapan web >tutorial js >Mengapa Acara Klik Pop Timbul Sambungan Chrome Saya Tidak Berfungsi?

Mengapa Acara Klik Pop Timbul Sambungan Chrome Saya Tidak Berfungsi?

Susan Sarandon
Susan Sarandonasal
2024-12-06 01:18:10399semak imbas

Why Aren't My Chrome Extension Popup Click Events Working?

Menyelesaikan Isu Pop Timbul Sambungan Chrome: Mengendalikan Peristiwa Klik

Apabila membuat pop timbul sambungan Chrome dengan JavaScript, pengguna mungkin menghadapi isu tentang peristiwa klik tidak dikendalikan dengan betul. Ini mungkin disebabkan oleh pelanggaran Dasar Keselamatan Kandungan (CSP) lalai.

Perihalan Masalah:

Seorang pembangun telah mencipta pembolehubah JavaScript dan butang dalam sambungan timbul. Selepas mengklik butang, pembolehubah dijangka meningkat sebanyak 1. Walau bagaimanapun, kod tidak berfungsi seperti yang dimaksudkan.

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

Halaman Pop Timbul HTML:

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

Penjelasan:

Isu ini timbul kerana kehadiran JavaScript sebaris dalam fail HTML. JavaScript sebaris dilarang oleh CSP lalai.

Penyelesaian:

Untuk menyelesaikan masalah ini, alihkan semua JavaScript sebaris ke fail JS yang berasingan.

hello.html (Timbul Halaman):

<!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;

Nota Tambahan:

Gunakan textContent dan bukannya innerHTML apabila mengubah suai kandungan teks untuk mengelakkan potensi kelemahan keselamatan.

Atas ialah kandungan terperinci Mengapa Acara Klik Pop Timbul Sambungan Chrome Saya Tidak Berfungsi?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

JavaScript json chrome html JS default this innerHTML issue
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：Bagaimana untuk Membuka Fail HTML Tempatan dengan Selamat dalam Chrome?Artikel seterusnya：Bagaimana untuk Membuka Fail HTML Tempatan dengan Selamat dalam Chrome?

Artikel berkaitan

Lihat lagi