2016-04-27 2 views
0

У меня есть расширение chrome, но JavaScript не загружается правильно. Я попытался связать файл, но потерпел неудачу. Есть ли идеи о том, как я могу заставить кнопки запускать функции при нажатии? < скрипт > теги не работают в этом и кнопки ничего не делать, но первоначальный JavaScript мчит ... Вот мой кодПравильное подключение JavaScript в chrome-расширениях

manifest.json (я думаю, что он работает правильно):

{ 
"manifest_version": 2, 

"name": "Getting started example", 
"description": "This extension shows a Google Image search result for the current page", 
"version": "1.0", 

"browser_action": { 
"default_icon": "icon.png", 
"default_popup": "popup.html" 
}, 
"permissions": [ 
"activeTab", 
"https://ajax.googleapis.com/" 
] 

    } 

popup.html (Функции в JavaScript не ссылаются на это):

<body style = "margin:10px"> 

<!-- Latest compiled and minified CSS --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 

<!-- Optional theme --> 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 

<!-- Latest compiled and minified JavaScript --> 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
<script src="popup.js"></script> 
<style> 
//Fancy styles 
large{font-size:30px} 
span{} 
.input-group{width:400px} 
</style> 
<!-- title --> 
<large> 
SpeedyURLs 
</large> 
<hr/> 
<!-- Code that won't link with JavaScript --> 
<div id = "stuff"> 

</div> 
<div class = "input-group" id = "content"><input class = "form-control" placeholder = "Enter a URL here. Ex: https://www.google.com"/><span class="input-group-addon btn btn-default" style = "font-size:20px;width:50px;color:black" id="basic-addon1" onclick = "addNew()">+  </span></div> 
<button onclick = 'document.write("HELLO")'>YAS</button> 
</body> 

popup.js (функции, которые не ссылаются):

function open(url){ 
window.open(url)} 
function addNew(){ 
document.getElementById("stuff").innerHTML = document.getElementById("stuff").innerHTML+'<div class = "input-group" id = "content"><input class = "form-control" placeholder = "Enter a URL here. Ex: https://www.google.com"/><span style = "font-size:20px;width:50px;color:black" class="input-group-addon btn btn-danger" id="basic-addon1">x</span></div>'} 

icon.png (Изображение по умолчанию отсутствует в нем, отлично работает)

Итак, функции в JS не будут ссылаться на HTML. Есть идеи?

+0

Возможный дубликат [OnClick в Extension Chrome не работает] (http://stackoverflow.com/questions/13591983/onclick-within-chrome-extension-not-working) –

ответ

1

By default, встроенный JavaScript не будет выполнен.

Вы можете

  1. Relax политику по умолчанию. См. Inline Script для более подробной информации.

  2. Удалить onclick в popup.html и переместить эту логику к вашему popup.js, код будет выглядеть (скажем, ваша кнопка идентификатор buttonId0)

    document.getElementById("buttonId0").addEventListener("click", function() { 
        // Your logic here 
    }, false); 
    
+0

http://stackoverflow.com/q/13591983/2213940 –

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