每个人,我都注意到有些人已经有同样的问题,但没有一个解决方案对我有帮助,所以这就是我在这里的原因。附:代码在浏览器中运行得很好,当我点击扩展名时它只是不起作用,我看到的唯一的东西是标签,但没有JS。而且,我调试了一下,并注意到唯一不起作用的是这一行:$.getJSON("http://api.openweathermap.org/data/2.5/find?q=Riga&type=like&APPID=06ae28a74a257d60dd4e80da4dd7cebe",function(data)
popup.js
document.addEventListener("DOMContentLoaded", function(){
var city_name, latitute, longtitude, weather, description, temp, country;
var today = new Date();
var dd = today.getDate();
var mm = today.getMonth()+1; //january = 0
var yyyy = today.getFullYear();
if(dd<10) {
dd = '0'+dd
}
if(mm<10) {
mm = '0'+mm
}
today = dd + '/' + mm + '/' + yyyy;
$.getJSON("http://api.openweathermap.org/data/2.5/find?q=Riga&type=like&APPID=06ae28a74a257d60dd4e80da4dd7cebe",function(data){
console.log(data.list[0])
city_name = data.list[0].name;
country = data.list[0].sys.country;
latitute = data.list[0].coord.lat;
longtitude = data.list[0].coord.lon;
weather = data.list[0].weather[0].main;
description = data.list[0].weather[0].description;
temp = data.list[0].main.temp - 273.15;//temperature in json object is provided in Kelvins, Celsius = Kelvin - 273.15
$(".city").html(city_name);
$(".weather").html(weather);
$(".temp").html(temp + " ℃");
$(".description").html(description)
$(".latitude").html(latitute);
$(".longtitude").html(longtitude);
$(".date").html(today);
});
})
popup.html
<!DOCTYPE html>
<html>
<head>
<title>Weather</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script src="popup.js"></script>
<style>
.label {
font-weight: bold;
}
</style>
</head>
<body style="min-width:200px">
<div><span class="label">Date: </span><span class="date"></span> </div>
<div><span class="label">City: </span><span class="city"></span></div>
<div><span class="label">Latitude: </span> <span class="latitude"></span></div>
<div><span class="label">Longtitude: </span> <span class="longtitude"></span></div>
<di><span class="label">Weather: </span> <span class="weather"></span></div>
<div><span class="label">Description: </span><span class="description"></span></div>
<div><span class="label">Temperature: </span> <span class="temp"></span></div>
</body>
</html>
的manifest.json
{
"manifest_version" : 2,
"name" : "Weather",
"description" : "Weather",
"version" : "1.0",
"browser_action" : {
"default_popup" : "popup.html"
},
"icons" : {
"16" : "weather.png",
"48" : "weather.png",
"120" : "weather.png"
},
"permissions" : [
"tabs" , "<all_urls>"
],
"content_scripts": [
{
"js" : ["popup.js"]
}
]
}
答:我没有使用JQuery CDN,而是创建了一个新文件jquery.min.js并将https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js中的所有内容放入该文件中,然后从HTML添加该文件的链接,在我的例子中它看起来像这样 - <script src="jquery.min.js"></script>
而不是<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
。希望能帮助到你