我将此代码放入wordpress页面构建器的添加基本模块HTML块中。我遇到死亡的白屏。 Chrome开发者控制台告诉我以下内容:
helpers.js?ver=4.5.3:15 Uncaught TypeError: $(...).sidr is not a function
可以从helpers.js?ver = 4.5.3的第15行进行追踪:
$('#mobile-menu-trigger').sidr({
source: sourceVal,
name: 'sidr-main'
});
在还原页面的先前版本之前或之后,没有此类错误。如果另存为html文件并使用chrome打开,则以下html代码似乎可以正常运行。有人可以解释一下可能导致该错误的原因吗?
编辑:当我更改wordpress的主题时,一切都会再次起作用。在所有其他主题下,代码都可以正常工作,因此问题应该出在主题之外。
$(document).ready(function() {
getUpdates();
});
function getUpdates() {
// get the data with a webservice call
$.getJSON('http://api.thingspeak.com/channels/136053/feed/last.json?callback=?', function(data) {
// if the field1 has data update the page
if (data.field1) {
document.querySelector('.info-giver .temperature').innerHTML = data.field1.slice(0,4) + "°C";
document.querySelector(".info-giver .humidity").innerHTML = data.field2.slice(0,5) + "%";
document.querySelector('.info-giver .windspeed').innerHTML = data.field4.slice(0,4) +" m/s";
document.querySelector(".info-giver .pressure").innerHTML = data.field3 +"Pa" ;
}
});
}
(jQuery);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class = "announcer">
<div class="temperatureDeclared" style= "width: 25.00%">Temperature</div>
<div class="humidityDeclared" style= "width: 25.00%">Humidity</div>
<div class="windspeedDeclared" style= "width: 25.00%">Windspeed</div>
<div class="pressureDeclared" style= "width: 25.00%">Pressure</div>
</div>
<div class = "info-giver">
<div class="temperature" style= "width: 25.00%">N/a</div>
<div class="humidity" style= "width: 25.00%">N/a</div>
<div class="windspeed" style= "width: 25.00%">N/a</div>
<div class="pressure" style= "width: 25.00%">N/a</div>
</div>
最佳答案
您没有包括sidr库。加载jquery后,包括sidr库。之后,在您的html上像这样初始化sidr。
$('#mobile-menu-trigger').sidr({....});