未捕获的类型错误:$(…).sidr不是一个功能[控制台Chrome开发工具]

Uncaught TypeError: $(...).sidr is not a function[Console Chrome developer tool]

本文关键字：一个 功能 开发工具 Chrome 控制台 sidr 类型 错误      更新时间：2023-09-26

我将这段代码放入wordpress页面构建器的add basic模块HTML块中。我遇到了白屏死机。Chrome开发者控制台告诉我以下内容:

helpers.js?ver=4.5.3:15 Uncaught TypeError: $(...).sidr is not a function

这可以从helpers.js中的第15行跟踪?ver=4.5.3: 

        $('#mobile-menu-trigger').sidr({
        source: sourceVal,
        name: 'sidr-main'
    });

在我恢复之前或之后的页面版本，没有这样的错误。下面的html代码似乎正常运行，如果保存为html文件，并打开它与chrome浏览器。有人能解释一下是什么导致了这个错误吗?

编辑:当我改变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>

在代码前后添加这些行，您的代码将正常运行

;(function($){
   //code
})(jQuery);

就像这样

;(function($){
 $('#mobile-menu-trigger').sidr({
        source: sourceVal,
        name: 'sidr-main'
 });
})(jQuery);

您没有包含您的sidr库。加载jquery后包括sidr库。然后在你的html上像这样初始化。

$('#mobile-menu-trigger').sidr({....});
相关文章：