0
Я делаю расширение Chrome, а всплывающее окно HTML содержит скрипты в JavaScript. Но, когда я нажимаю кнопку расширения, JavaScript не работает. Мой HTML-код содержит вызов JavaScript, но он работает неправильно.JavaScript не работает в расширениях Chrome
Мой JS код (func01.js) и мой HTML всплывающее окно:
function openMenu(){
document.getElementById("others_nav").style.visibility = 'visible';
}
function closeMenu(){
document.getElementById("others_nav").style.visibility = 'hidden';
}
function openMail(){
document.getElementById("mail").style.visibility = 'visible';
document.getElementById("vagas").style.visibility = 'hidden';
document.getElementById("log").style.visibility = 'hidden';
document.getElementById("themes").style.visibility = 'hidden';
document.getElementById("search").style.visibility = 'hidden';
document.getElementById("about").style.visibility = 'hidden';
document.getElementById("index").style.visibility = 'hidden';
}
function openVagas(){
document.getElementById("mail").style.visibility = 'hidden';
document.getElementById("vagas").style.visibility = 'visible';
document.getElementById("log").style.visibility = 'hidden';
document.getElementById("themes").style.visibility = 'hidden';
document.getElementById("search").style.visibility = 'hidden';
document.getElementById("about").style.visibility = 'hidden';
document.getElementById("index").style.visibility = 'hidden';
}
function openLog(){
document.getElementById("mail").style.visibility = 'hidden';
document.getElementById("vagas").style.visibility = 'hidden';
document.getElementById("log").style.visibility = 'visible';
document.getElementById("themes").style.visibility = 'hidden';
document.getElementById("search").style.visibility = 'hidden';
document.getElementById("about").style.visibility = 'hidden';
document.getElementById("index").style.visibility = 'hidden';
}
function openThemes(){
document.getElementById("mail").style.visibility = 'hidden';
document.getElementById("vagas").style.visibility = 'hidden';
document.getElementById("log").style.visibility = 'hidden';
document.getElementById("themes").style.visibility = 'visible';
document.getElementById("search").style.visibility = 'hidden';
document.getElementById("about").style.visibility = 'hidden';
document.getElementById("index").style.visibility = 'hidden';
}
function openSearch(){
document.getElementById("mail").style.visibility = 'hidden';
document.getElementById("vagas").style.visibility = 'hidden';
document.getElementById("log").style.visibility = 'hidden';
document.getElementById("themes").style.visibility = 'hidden';
document.getElementById("search").style.visibility = 'visible';
document.getElementById("about").style.visibility = 'hidden';
document.getElementById("index").style.visibility = 'hidden';
}
function openAbout(){
document.getElementById("mail").style.visibility = 'hidden';
document.getElementById("vagas").style.visibility = 'hidden';
document.getElementById("log").style.visibility = 'hidden';
document.getElementById("themes").style.visibility = 'hidden';
document.getElementById("search").style.visibility = 'hidden';
document.getElementById("about").style.visibility = 'visible';
document.getElementById("index").style.visibility = 'hidden';
}
function menuWarning(){
document.getElementById("z-index-nav-2").src = ('src/habilite-this-menu.png');
}
function menuWarningOut(){
document.getElementById("z-index-nav-2").src = ('src/z-index-nav.png');
}<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="src/hover-min.css"/>
<link rel="stylesheet" type="text/css" href="src/st01.css"/>
<script language="javascript" src="src/func01.js"></script>
</head>
<body>
<div id="div_body">
<nav id="main_nav">
<ul>
<a href="http://forum.craftlandia.com.br/ipb/index.php?/forum/295-avisos/" target="_blank"><li class="hvr-overline-reveal">Avisos</li></a>
<a href="http://forum.craftlandia.com.br/ipb/index.php?/forum/296-entrevistas/" target="_blank"><li class="hvr-overline-reveal">Entrevistas</li></a>
<a href="http://forum.craftlandia.com.br/ipb/index.php?/forum/297-mat%C3%A9rias/" target="_blank"><li class="hvr-overline-reveal">Matérias</li></a>
<a href="http://forum.craftlandia.com.br/ipb/index.php?/forum/594-noticias/" target="_blank"><li class="hvr-overline-reveal">Notícias</li></a>
<a href="http://forum.craftlandia.com.br/ipb/index.php?/forum/298-concursos/" target="_blank"><li class="hvr-overline-reveal">Concursos</li></a>
<li id="more" class="hvr-overline-reveal" onclick="openMenu()">Mais</li>
</ul>
</nav>
<div class="div_main_content" id="index">
<h1>Seja bem-vindo à extensão do Jornal!</h1>
<h2>Navegue pelos menus para selecionar alguma opção.</h2>
</div>
<div class="div_main_content" id="mail">
</div>
<div class="div_main_content" id="vagas">
<h1>Vagas para jornalistas</h1>
<p>Estamos constantemente procurando membros com maturidade, responsabilidade e habilidade com escrita. Se você acha que atende a esses requisitos, acesse já o tópico oficial e faça já seu currículo!</p>
<form id="view-topic-vagas" method="post" action="http://forum.craftlandia.com.br/ipb/index.php?/topic/543799-abertas-vagas-para-o-jornal/" target="_blank">
<input class="input_submit" type="submit" value="Ver o tópico completo"/>
</form>
</div>
<div class="div_main_content" id="log">
<h1>ChangeLog do Jornal</h1>
<p>Assim como a ChangeLog da Craftlandia, a nossa ChangeLog te deixa informado de tudo que acontece na área. Para não perder nenhuma novidade, não deixe de acessá-la.</p>
<form id="view-topic-log" method="post" action="http://forum.craftlandia.com.br/ipb/index.php?/topic/471019-changelog-do-jornal/" target="_blank">
<input class="input_submit" type="submit" value="Ver o tópico completo"/>
</form>
</div>
<div class="div_main_content" id="themes">
<h1>Sugestões de temas</h1>
<p>Quer ver um tema sendo trabalhado na área oficial? A maneira mais fácil de fazer isso acontecer é postar uma sugestão no tópico oficial. Caso aceita, sua sugestão será trabalhada e postada o mais breve possível.</p>
<form id="view-topic-themes" method="post" action="http://forum.craftlandia.com.br/ipb/index.php?/topic/452580-sugest%C3%B5es-para-temas/" target="_blank">
<input class="input_submit" type="submit" value="Ver o tópico completo"/>
</form>
</div>
<div class="div_main_content" id="search">
<h1>Formulário de pesquisa</h1>
<p>Digite abaixo um termo que deseja pesquisar e veja os resultados.</p>
<form id="search-box" method="post" action="http://forum.craftlandia.com.br/ipb/index.php?app=core&module=search&do=search&fromMainBar=1" target="_blank">
<input id="main_search" name="search_term" type="text" size="25"/><br/>
<input class="input_submit" name="submit" type="submit" value="Pesquisar"/>
</form>
</div>
<div class="div_main_content" id="about">
<h1>Sobre o Jornal da CL</h1>
<p>O nosso jornal foi criado para transmitir informações sobre os mais diversos assuntos, como tecnologia, jogos, astronomia, entrevistas com os membros e STAFFs da Craftlandia, além de concursos excluvisos da nossa área. Essa extensão foi criada para aproximar você, player, da nossa área, e nos ajudar a crescer cada vez mais.</p>
</div>
<nav id="others_nav">
<ul>
<li onclick="openMail()"><img src="src/icon-01.png"/></li>
<li onclick="openVagas()"><img src="src/icon-02.png"/></li>
<li onclick="openLog()"><img src="src/icon-03.png"/></li>
<li onclick="openThemes()"><img src="src/icon-04.png"/></li>
<li onclick="openSearch()"><img src="src/icon-05.png"/></li>
<li onclick="openAbout()"><img src="src/icon-06.png"/></li>
<li id="btn_close" onclick="closeMenu()"><img src="src/close-icon.png"/></li>
</ul>
</nav>
<nav id="z-index-nav">
<ul>
<li onmouseover="menuWarning()" onmouseout="menuWarningOut()"><img id="z-index-nav-2" src="src/z-index-nav.png"/></li>
</ul>
</nav>
</div>
</body>
</html>Как сделать JS правильно работать в Chrome Extensions?
Вы более склонны получать ответы с более коротким вопрос/меньше кода. Можете ли вы обрезать это? – Adrian