ホームページ >ウェブフロントエンド >jsチュートリアル >Chrome 拡張機能のポップアップ クリック イベントが機能しないのはなぜですか?
Chrome 拡張機能のポップアップ クリック イベントが機能しないのはなぜですか?
- Susan Sarandonオリジナル
- 2024-12-06 01:18:10399ブラウズ
Chrome 拡張機能のポップアップの問題の修正: クリック イベントの処理
JavaScript を使用して Chrome 拡張機能のポップアップを作成すると、クリック イベントが発生する問題が発生する可能性があります。正しく処理されていません。これは、デフォルトのコンテンツ セキュリティ ポリシー (CSP) の違反が原因である可能性があります。
問題の説明:
開発者が拡張機能内に JavaScript 変数とボタンを作成しました。ポップアップ。ボタンをクリックすると、変数は 1 ずつ増加することが期待されます。しかし、コードは意図したとおりに機能しません。
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"
}
}
ポップアップページHTML:
<!DOCTYPE html>
<html>
<head>
<script>
var a=0;
function count()
{
a++;
document.getElementById("demo").innerHTML=a;
return a;
}
</script>
</head>
<body>
<p>
説明:
この問題は、HTML ファイルにインライン JavaScript が存在するために発生します。インライン JavaScript はデフォルトの CSP で禁止されています。
解決策:
この問題を解決するには、すべてのインライン JavaScript を別の JS ファイルに移動します。
hello.html (ポップアップページ):
<!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;
補足:
を使用します潜在的なセキュリティ脆弱性を防ぐためにテキスト コンテンツを変更する場合は、innerHTML の代わりに textContent を使用します。
以上がChrome 拡張機能のポップアップ クリック イベントが機能しないのはなぜですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
声明：
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。