2016-07-22 136 views
0

我正在尝试在我的网站上实现simpleWeather.js

不幸的是,当我把html的在我的网站,我得到

Uncaught TypeError: $.simpleWeather is not a function

我在我的HTML顶部引用simpleWeather.js:

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.simpleWeather/3.1.0/jquery.simpleWeather.min.js"></script> 

它被加载在网站上:

enter image description here

它完美对codepen.io虽然:/任何想法?

编辑:

我完整的代码看起来是这样的:

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.simpleWeather/3.1.0/jquery.simpleWeather.min.js"></script> 
<script type="text/javascript"> 
    //copied javascript from codepen.io 
</script> 
<style type="text/css"> 
    //copied css from codepen.io 
</style> 
//copied html from codepen.io 
+0

哪里是关于您的jQuery脚本标记您的simpleweather脚本标签? (他们必须是这样的顺序:jQuery第一,然后是简单的天气。) –

+0

我认为你正在试图在插件加载之前调用'simpleWeather' ... –

+0

'jquery.min.js'引用就在'jquery之上。 simpleWeather.min.js'。我做了一切,如在codepen.io示例中:/ –

回答

0

看起来像你对我可能有脚本错误的顺序。您的用于jQuery的script标记必须是之前的您的script标记for simpleWeather。然后你的脚本使用 simpleWeather必须在此之后。 (如果您使用的脚本加载器,你需要确保加载顺序。)

0

请检查代码的顺序...

你必须包括图书馆第一,那么你可以访问$ .simpleWeather( ) 方法。代码顺序是这样的。

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.simpleWeather/3.1.0/jquery.simpleWeather.min.js"></script> 
... 
... 
... 
<script> 
$.simpleWeather({ 
    zipcode: '76309', 
    unit: 'f', 
    success: function(weather) { 
     html = '<h2>'+weather.city+', '+weather.region+'</h2>'; 
     html += '<img style="float:left;" width="125px" src="images/weather/'+weather.code+'.png">'; 
     html += '<p>'+weather.temp+'&deg; '+weather.units.temp+'<br /><span>'+weather.currently+'</span></p>'; 
     html += '<a href="'+weather.link+'">View Forecast &raquo;</a>'; 

     $("#weather").html(html); 
    }, 
    error: function(error) { 
     $("#weather").html("<p>"+error+"</p>"); 
    } 
}); 
</script> 
0

试试这样说:

jQuery(document).ready(function ($) { 
    // your code 
}); 

而且,写script标签后htmlcss

相关问题