Jquery'$'是未定义的 [英] Jquery '$' is undefined
问题描述
我已经创建了下面的网页，并在几台机器上成功运行了它。
当我在另一台机器上运行它时，它会失败。在调试时出现这个错误：Error：'$'is undefined
在IE 9上运行。
尝试将Jquery链接更改为：
< script src =// ajax.googleapis.com/ajax/libs/的jquery / 1.10.2 / jquery.min.js>< /脚本>
但它没有帮助。
错误原因是什么？
有完整的代码：
<！DOCTYPE html>
< html>
< head>
< title>简易地图< /标题>
< meta name =viewportcontent =initial-scale = 1.0，user-scalable = no>
< meta charset =utf-8>
< META HTTP-EQUIV =刷新CONTENT =420>
< style type =text / css>
html，body，＃map-canvas {
height：100％;
margin：0px;
填充：0px
}
。标签{
颜色：橙色;
背景颜色：黑色;
font-family：Lucida Grande，Arial，sans-serif;
font-size：10px;
font-weight：bold;
text-align：center;
width：50px;
border：2px纯黑色;
white-space：nowrap;}
< / style>
< script src =http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js>< / script>
< script src =https://jquery-xml2json-plugin.googlecode.com/svn/trunk/jquery.xml2json.jstype =text / javascriptlanguage =javascript>< /脚本>
< script src =https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false>< / script>
< script src =http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.0.1/src/markerwithlabel.js>< / script> ;
< script>
var markers = [];
var map = null;
$ b $ .get（'Customers.xml'，function（xml）{
var jsonObj = $ .xml2json（xml）;
$ .each（jsonObj.Marker，function （）{
var stat = this.site_status ==Critical？http://maps.google.com/mapfiles/ms/micons/red-dot.png：http：// maps。 google.com/mapfiles/ms/micons/green-dot.png;
var mark = {
title：this.title，
location：this.site_location，
icon ：stat
}
markers.push（mark）;
}）;
for（var i = 0; i< markers.length; i ++）{
var maddress = markers [i] .location;
var image = markers [i] .icon;
var custname = markers [i] .title;
geocodeAddress（maddress，image，custname，map ）;
}
}）;
函数geocodeAddress（maddress，image，custname，map）{
var geocoder = new google.maps.Geocoder（）;
geocoder.geocode（{'address'：maddress}，function（results，status）{
if（status == google.maps.GeocoderStatus.OK）{
var myLatlng = new google .maps.LatLng（results [0] .geometry.location.lat（），results [0] .geometry.location.lng（））;
var iconBase ='https://maps.google.com/ mapfiles / kml / shapes /';
var marker = new MarkerWithLabel（{
position：myLatlng，map：map，icon：image，labelContent：custname，
labelAnchor：new google.maps。 Point（22，0），
labelClass：labels，//标签的CSS类
labelStyle：{opacity：0.75}}）;
} else {
警报（地理编码不成功，原因如下：+状态）;
}
}）;
函数initialize（）{
var chicago = new google.maps.LatLng（35.442579，-40.895920）;
var mapOptions = {
zoom：4，
center：chicago，
mapTypeId：google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map（document.getElementById（'map-canvas'），mapOptions）;
}
google.maps.event.addDomListener（window，'load'，initialize）;
< / script>
< / head>
< body>
< div id =map-canvas>< / div>
< / body>
< / html>
预先致谢。
函数 $ 被保存在脚本中：
// ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js
因此，即使调用 $（function（）{ ...或 $（document）.ready（ ...在这个脚本加载之前，都会导致 $ 为 undefined
由于脚本的加载顺序看起来正确，因此您无法加载jquery.min文件 - 请尝试从问题机器中点击此链接以确保
和/或（并且不会引发CDN和本地辩论） - 下载jquery文件并在本地调用它（如果您的访问者由于其他原因无法看到文件，该怎么办？） - 至少有一个备份计划。
< script src =/ pathtojsfiles / jquery.min.js>< / script>
除此之外，还有一个更好的方法（加载该脚本将使用的标记）文档设置将在关闭< / body> 标签之前，使用这些脚本在标记下放置脚本和您的函数。这（为更多SEO相关网站）将确保您的页面内容在加入外部JS之前加载。
！ - 这些看起来已经被某些类型的弹出式答案所说，但无论如何发布......
I have created the webpage below and successfully ran it on several machines. When I run it on another machine it fails. When debugging it this error: Error: '$' is undefined
Running on IE 9.
I have tried to change the Jquery link to:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
but it didn't help. What can be the reason for the error ?
There is the complete code:
<!DOCTYPE html>
<html>
<head>
<title>Simple Map</title>
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta charset="utf-8">
<META HTTP-EQUIV="Refresh" CONTENT="420">
<style type="text/css">
html, body, #map-canvas {
height: 100%;
margin: 0px;
padding: 0px
}
.labels {
color: orange;
background-color: black;
font-family: "Lucida Grande", "Arial", sans-serif;
font-size: 10px;
font-weight: bold;
text-align: center;
width: 50px;
border: 2px solid black;
white-space: nowrap;}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="https://jquery-xml2json-plugin.googlecode.com/svn/trunk/jquery.xml2json.js" type="text/javascript" language="javascript"></script>
<script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
<script src="http://google-maps-utility-library-v3.googlecode.com/svn/tags/markerwithlabel/1.0.1/src/markerwithlabel.js"></script>
<script>
var markers = [];
var map = null;
$.get('Customers.xml', function(xml) {
var jsonObj = $.xml2json(xml);
$.each(jsonObj.Marker, function(){
var stat = this.site_status == "Critical" ? "http://maps.google.com/mapfiles/ms/micons/red-dot.png" : "http://maps.google.com/mapfiles/ms/micons/green-dot.png";
var mark = {
title: this.title,
location: this.site_location,
icon: stat
}
markers.push(mark);
});
for(var i=0; i< markers.length; i++){
var maddress = markers[i].location;
var image = markers[i].icon;
var custname = markers[i].title;
geocodeAddress(maddress, image, custname,map);
}
});
function geocodeAddress(maddress, image, custname,map) {
var geocoder = new google.maps.Geocoder();
geocoder.geocode( { 'address': maddress}, function(results, status) {
if (status == google.maps.GeocoderStatus.OK) {
var myLatlng = new google.maps.LatLng(results[0].geometry.location.lat(),results[0].geometry.location.lng());
var iconBase = 'https://maps.google.com/mapfiles/kml/shapes/';
var marker = new MarkerWithLabel({
position: myLatlng, map:map, icon: image,labelContent: custname,
labelAnchor: new google.maps.Point(22, 0),
labelClass: "labels", // the CSS class for the label
labelStyle: {opacity: 0.75}});
} else {
alert("Geocode was not successful for the following reason: " + status);
}
});
}
function initialize() {
var chicago = new google.maps.LatLng(35.442579,-40.895920);
var mapOptions = {
zoom: 4,
center: chicago,
mapTypeId: google.maps.MapTypeId.ROADMAP
}
map = new google.maps.Map(document.getElementById('map-canvas'), mapOptions);
}
google.maps.event.addDomListener(window, 'load', initialize);
</script>
</head>
<body>
<div id="map-canvas"></div>
</body>
</html>
Thanks in advance.
The function $ is held within the script :
//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js
So even calling $(function() { ... or $(document).ready( ... before this script has loaded will both result in $ being undefined
As your load order of the scripts looks correct, it appears like you are not able to load the jquery.min file - try clicking this link from the machine with the problem to make sure
And /or ( and not to spark a CDN vrs Local debate ) - download the jquery file and call it locally (what if your visitor could not see the file for other reasons? ) - at teh very least have a back up plan.
<script src="/pathtojsfiles/jquery.min.js"></script>
as an aside, a better ( loading your markup that that scripts are going to use ) document setup would be to place the scripts and your functions using these scripts under the markup, before the closing </body> tag. This ( for more SEO related websites ) will ensure your page contents are loaded before you add external JS.
! - This looks already said by some of these answers popping in as a type, but posting anyway ..
这篇关于Jquery'$'是未定义的的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
