0

Я пытаюсь разработать простое расширение cheome, но я не в состоянии установить JQuery для работы с ним:выпуск на Беговой JQuery на Chrome Extension

Вот мой файл Структура:

--root
                - manifest.json
                - popup.html
                - script.js
                - JS
                              - jquery.js
                              - clip.js

Вот код, который я имею в manifest.json

{ 
    "manifest_version": 2, 

    "name": "My ext", 
    "description": "This is a Development.", 
    "version": "1.0", 

    "browser_action": { 
    "default_icon": "icon.png", 
    "default_popup": "popup.html" 
    }, 
    "permissions": [ 
    "https://secure.flickr.com/" 
    ], 

    "content_scripts": [ 
    { 
    "all_frames": false, 
    "matches": ["<all_urls>"], 
    "exclude_matches": [], 
     "css": [ 
     "css/content/page.css" 
     ], 
     "js": [ 
     "js/jquery.js", 
     "js/clip.js" 
     ] 
    } 
    ] 
} 

и popup.html как:

<!doctype html> 
<html> 
    <head> 
    <title>My app</title> 
    <style>body {min-width: 357px;overflow-x: hidden;} </style> 
    <!-- 
     - JavaScript and HTML must be in separate files: see our Content Security 
     - Policy documentation[1] for details and explanation. 
     - 
     - [1]: http://developer.chrome.com/extensions/contentSecurityPolicy.html 
    --> 
    <script src="script.js"></script> 
    </head> 
    <body> 
    <table style="width:300px"> 
<tr> 
    <td id="fname">Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
</tr> 
<tr> 
    <td>Eve</td> 
    <td>Jackson</td> 
    <td>94</td> 
</tr> 
</table> 
    </body> 
</html> 

и, наконец, script.js как:

$("#fname").on("click", function() { 
    alert("HI"); 
}); 

Я также trired запустить и JQuery через <head>, вызвав JQuery из КДС и объявить документ готовый JavaScript на странице, но это тоже не сработало.

<!doctype html> 
<html> 
    <head> 
    <title>My app</title> 
    <style>body {min-width: 357px;overflow-x: hidden;} </style> 
    <!-- 
     - JavaScript and HTML must be in separate files: see our Content Security 
     - Policy documentation[1] for details and explanation. 
     - 
     - [1]: http://developer.chrome.com/extensions/contentSecurityPolicy.html 
    --> 
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> 
    <script> 
    $(document).ready(function() { 
    $("#fname").on("click", function() { 
     alert("HI"); 
     }); 
    }); 
    </script> 
    </head> 
    <body> 
    <table style="width:300px"> 
<tr> 
    <td id="fname">Jill</td> 
    <td>Smith</td> 
    <td>50</td> 
</tr> 
<tr> 
    <td>Eve</td> 
    <td>Jackson</td> 
    <td>94</td> 
</tr> 
</table> 
    </body> 
</html> 

Не могли бы вы дать мне знать, что я делаю неправильно?

ответ

0

Возможно, у вас возникли проблемы с настройкой.

Возможно, вы захотите прочитать в Content Scripts, поскольку они, похоже, не делают то, что, по вашему мнению, они делают. Скрипты содержимого - это когда вы вводите на страницу другого сайта. Это не ваша страница. Фактически вы вставляете файл jquery на свою страницу.
https://developer.chrome.com/extensions/content_scripts.html

Содержание Сценарии

Content сценарии JavaScript файлы, которые запускаются в контексте веб-страниц. С помощью стандартного Document Object Model (DOM), они могут читать информацию о веб-страницах, посещения браузера, или внести изменения в

Кроме того, вы не можете запустить встроенный JavaScript без настройки политики безопасности: http://developer.chrome.com/extensions/contentSecurityPolicy.html#JSExecution

Инлайн JavaScript не будет выполнен

Инлайн JavaScript не будет выполняться. Это ограничение запрещает как встроенные блоки, так и встроенные обработчики событий (например,).

Вы пробовали включить jQueryCDN И ваш script.js в голову вашего HTML? Как это:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> 
<script src="script.js"></script> 

Вы manifest.json должны также включать в себя следующее:

"content_security_policy": "script-src 'self' https://*.googleapis.com; object-src 'self'" 
+0

Благодаря Esteban Felix, это было очень полезно, но, как о решении? как добавить jquery в расширение? – user3162145

+0

@ user3162145 Я обновил свой ответ, вы почти получили его! Вам просто нужно было объединить оба подхода! –

+0

да на самом деле последний образец кода в сообщении я добавил код в , но jquery не работает thete! – user3162145

Смежные вопросы