Question

我正在尝试创建我的第一个简单的Chrome应用程序，但是无法解决如何将javascript加载到页面中的问题。我了解在Chrome应用中，你不能使用内联javascript，但我的理解是你可以使用<script src="file.js">标签包含javascript（如果我误解了这一点，请告诉我）。我可以在第一级应用程序导航（index.html包括main.js文件）上加载javascript，但是如果它要包含在main.js的任何其他html页面中我无法加载javascript可以加载（例如，main.js加载login.html到<div>，但我无法将login.js注入login.html）。

manifest.json看起来像：

{
  "manifest_version": 2,
  "name": "test",
  "short_name": "test",
  "description": "",
  "version": "0.0.1",
  "minimum_chrome_version": "38",

  "icons": {
    "16": "assets/icon_16.png",
    "128": "assets/icon_128.png"
  },

  "app": {
    "background": {
      "scripts": ["background.js"]
    }
  },
  "content_scripts": [{
    "matches": ["<all_urls>"],
      "js": ["jquery-2.1.3.min.js"]
  }]  
}

background.js看起来像：

chrome.app.runtime.onLaunched.addListener(function(launchData) {
  chrome.app.window.create(
    'index.html',
    {
      id: 'mainWindow',
      bounds: {width: 800, height: 600}
    }
  );
});

index.html看起来像：

<!DOCTYPE html>
<html>
    <head>
      <title>test</title>
      <script src="jquery.js"></script>
      <link rel="stylesheet" href="styles.css">
    </head>

    <body>
      <div id="applicationDiv"></div>
      <script src="main.js"></script>
    </body>
</html>

main.js看起来像：

$(document).ready(function() {
  // if user isn't already logged in
  $('#applicationDiv').load('login.html');
});

login.html看起来像：

<!DOCTYPE html>

<html>
  <head>
      <meta charset="UTF-8">
    </head>
    <body>
      <div>
        <input type="button" id="clickButton" value="Sign In"/>
      </div>
      <script src="login.js"></script>
    </body>
</html>

login.js看起来像：

$("#clickButton").click(function() {
  console.log('in login.js');
});

以下是我尝试过的login.js的其他变体，但无法加载：

变化1：

$(document).ready( function () {
  console.log('in document ready');
  $("#signinButton").click(function() {
    console.log('in login.js');
  });
});

变化2：

 document.addEventListener('DOMContentLoaded', function() {
     var singninButton = document.getElementById('signinButton');
     // onClick's logic below:
     signinButton.addEventListener('click', function() {
         console.log('signin button pushed');
     });
 });

我尝试过的另一件事是将<script src="login.js"></script>移到<head></head> login.html，这不起作用，我也不相信我应该这样做（请告诉我，如果我我错了。

我尝试过的另一件事是将login.js添加到manifest.json文件中的内容脚本列表中，该列表不起作用，再一次，我觉得我不需要（请让我知道我是不是错了。）

如果有人可以帮助我将login.js加载到Chrome应用程序并将“登录”按钮加载到它写入控制台的位置，我们将不胜感激！如果我需要任何其他信息，请告诉我。我没有共享任何代码的问题，因为这只是我试图学习如何创建一个Chrome应用程序并了解javascript如何在其中运行。

提前致谢!!!

无法在Chrome应用中加载javascript

0 个答案: