У меня возникают проблемы с использованием библиотеки материализации в моем расширении chrome для отображения настраиваемого модального окна при нажатии кнопки. Я уже написал код ( в моем сценарии содержимого ) для вставки кнопки на существующую веб-страницу. В моем диалоге. html у меня есть HTML для моего модального окна (с использованием этого шаблона из materialize- css). Теперь я пытаюсь вызвать $('.modal').modal('open'); внутри функции, которая вызывается при нажатии кнопки (я подтвердил, что onclick работает нормально, поскольку console.log () работает внутри этой функции.
Однако, когда я пытаюсь запустить $('.modal').modal('open');, я получаю эту ошибку: Uncaught TypeError: $(...).modal is not a function. (Я также пробовал запустить $('.modal').modal(); и другие реализации, которые я нашел в stackoverflow, но безрезультатно.
Мой манифест. json выглядит так:
{
"manifest_version": 2,
"name": "MyChromeExtension",
"version": "0.1",
"content_scripts": [
{
"matches": ["*://www.messenger.com/*"],
"css": ["/thirdParty/materialize.css"],
"js": ["/thirdParty/jquery.min.js","/thirdParty/materialize.js", "content-final.js"]
}
],
"web_accessible_resources": ["/thirdParty/bootstrap.min.css", "/thirdParty/jquery.min.js", "/thirdParty/bootstrap.min.js", "dialog.html", "/thirdParty/materialize.css", "/thirdParty/materialize.js"],
"permissions": ["tabs", "<all_urls>"],
"background": {
"scripts":["background.js"]
},
"content_security_policy": "script-src 'self' 'unsafe-eval' https://cdn.jsdelivr.net; object-src 'self'"
}
Я сохранил локальные копии моих jquery, bootstrap и материализовал файлы внутри моей папки ThirdParty, но по какой-то причине мой код не работает. Я также пробовал установить все эти фреймворки через npm и использовать browserify , чтобы объединить их в мой content-final. js, но это тоже не работает.
Кто-нибудь знает, почему это могло происходить?