Невозможно вызвать функцию JavaScript в html при нажатии кнопки

Я делал расширение Chrome, для которого у меня есть html-файл, файл JavaScript, который открывает измененную ссылку на новой вкладке, файле манифеста и значке.Невозможно вызвать функцию JavaScript в html при нажатии кнопки

Он отлично работает, но теперь я хочу, чтобы функция javascript работала только тогда, когда пользователь нажимает кнопку. Поэтому я сделал кнопку в html-файле, поместил код js внутри функции и вызвал функцию, используя onclick.

Но по какой-то причине он не работает. При нажатии кнопки ничего не происходит. Я попытался перезагрузить расширение. Кроме того, я взял рабочий пример простой программы, в которой при нажатии кнопки появляется сообщение «Hello world» с помощью alert().

Это прекрасно работает, когда я открываю html-страницу непосредственно в chrome, но когда я заменил это на функцию, которую я создал, ничего не происходит при нажатии.

Может кто-нибудь найти ошибку/проблему?

Файл urltry.html является:

<!DOCTYPE html> 
<html> 
<button onclick="editorial()">View Editorial</button> 
<script> 
function editorial() 
{ 
chrome.tabs.query({currentWindow: true, active: true}, function(tabs){ 
    var tab_url=tabs[0].url; 
    var new_url=tab_url.slice(11); 
    chrome.tabs.create({ url:"http://www.discuss." + new_url});   
}); 
} 
</script> 
</html>

источник

2014-08-30 Naman Sancheti

Я уверен, что расширения Chrome не позволяют встроенным обработчикам событий. Я предлагаю прочитать https://developer.chrome.com/extensions/tut_migration_to_manifest_v2#inline_scripts – Oleg

возможный дубликат [onClick внутри расширения Chrome не работает] (http://stackoverflow.com/questions/13591983/onclick-within-chrome-extension -независимо) – Xan

Благодаря политике по умолчанию Content Security (НСП) в расширениях Google Chrome, следующие отвергается:

Eval и связанные с ними функции
Встроенный JavaScript

. Предложение, предоставленное Google Chrome Extensions documentation on SCP, заключается в том, чтобы поместить код в отдельный файл и использовать надлежащую привязку к событию click из JavaScript. Смотри ниже.

Ваш файл HTML:

<!DOCTYPE html> 
<html> 
<head> 
    <script src="editorial.js"></script> 
</head> 
<body> 
    <button id="viewEditorial">View Editorial</button> 
</body> 
</html>

Ваш файл JavaScript, editorial.js

function editorial() { 
    chrome.tabs.query({currentWindow: true, active: true}, function(tabs){ 
    var tab_url=tabs[0].url; 
    var new_url=tab_url.slice(11); 
    chrome.tabs.create({ url:"http://www.discuss." + new_url});   
    }); 
} 

document.addEventListener('DOMContentLoaded', function() { 
    var btn = document.getElementById('viewEditorial'); 
    if (btn) { 
    btn.addEventListener('click', editorial); 
    } 
});

Примечание: не забывайте, что вам нужно объявить "tabs" разрешение, чтобы иметь возможность изменить URL-адрес. См. tabs documentation.

источник

2014-08-30 09:44:29 Oleg

Большое спасибо за то, что нашли время и помогли мне решить эту проблему. Я не знал о CSP, поскольку я новичок в расширениях Chrome. Ваше решение было хорошо написано, и оно действительно сработало .. :) –

Ну, я пытался добавить дополнительные функции, и теперь я застрял в этой проблеме - http://stackoverflow.com/questions/25584927/issue- open-new-tab-in-multiple-functions-in-javascript-for-chrome-extension Пожалуйста, взгляните на него и посмотрите, поможет ли u. –

Вы должны поставить кнопку внутри тела тега, иначе много плохих вещей может произойти, и, вероятно, браузер идет в режиме совместимости.

Решение:

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function editorial() 
{ 
chrome.tabs.query({currentWindow: true, active: true}, function(tabs){ 
    var tab_url=tabs[0].url; 
    var new_url=tab_url.slice(11); 
    chrome.tabs.create({ url:"http://www.discuss." + new_url});   
}); 
} 
</script> 
</head> 
<body> 
    <button onclick="editorial()">View Editorial</button> 
</body> 
</html>

источник

2014-08-30 09:25:10

Ничего плохого не произойдет.Chrome автоматически создает элемент '' и обертывает скрипт и кнопку в нем. – Oleg

Вы можете попробовать с этим,

<body> 
    <button onclick="javascript:editorial()">View Editorial</button> 
</body>

Это будет работать в EDGE браузере Microsoft также.

источник

2017-01-07 13:06:18

Это может работать в Edge, но это не так: это не будет работать в расширении Chrome. – Teepeemm

Должна быть работа в Chrome, IE, Edge, Firefox и Maxthon. –

Работа в хромированном * расширении * отличается от работы в хроме. Расширения явно запрещают 'onclick'. См. [Документация] (https://developer.chrome.com/extensions/contentSecurityPolicy#JSExecution). – Teepeemm

Невозможно вызвать функцию JavaScript в html при нажатии кнопки

ответ

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