我有live score网站,它不是基于wordpress的,我为纯php网站构建了一个小部件,但现在我想向wordpress用户提供这个小部件。问题是,当我尝试这个小部件时,我出现了三个错误,老实说,我不是wordpress专家,所以我希望在这里得到帮助。这是我的用户链接:
<div id="widget-container" class="my_widget" name=\'15\' width="800px"></div>
<script src="http://skormix.com/mywidget/widget.js" type="text/javascript"></script>
下面是错误:
未捕获引用错误:$未定义未捕获引用错误:jQuery未定义未捕获类型错误:无法调用未定义的方法“ajax”,这是我的小部件代码的一部分:
(function() {
// Localize jQuery variable
var jQuery;
/******** Load jQuery if not present *********/
if (window.jQuery === undefined || window.jQuery.fn.jquery !== \'1.8.3\') {
var script_tag = document.createElement(\'script\');
script_tag.setAttribute("type","text/javascript");
script_tag.setAttribute("src",
"http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js");
var script_tag1 = document.createElement(\'script\');
script_tag1.setAttribute("type","text/javascript");
script_tag1.setAttribute("src",
"http://localhost/aaa/include-js/jquery_timer.js");
if (script_tag.readyState) {
script_tag.onreadystatechange = function () { // For old versions of IE
if (this.readyState == \'complete\' || this.readyState == \'loaded\') {
scriptLoadHandler();
}
};
} else { // Other browsers
script_tag.onload = scriptLoadHandler;
}
// Try to find the head, otherwise default to the documentElement
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag);
(document.getElementsByTagName("head")[0] || document.documentElement).appendChild(script_tag1);
} else {
// The jQuery version on the window is the one we want to use
jQuery = window.jQuery;
main();
}
/******** Called once jQuery has loaded ******/
function scriptLoadHandler() {
// Restore $ and window.jQuery to their previous values and store the
// new jQuery in our local jQuery variable
jQuery = window.jQuery.noConflict(true);
// Call our main function
main();
}
/******** Our main function ********/
function main() {
jQuery(document).ready(function($) {
/******* Load CSS *******/
var css_link = $("<link>", {
rel: "stylesheet",
type: "text/css",
href: "http://localhost/aaa/widget/blue.css"
});
css_link.appendTo(\'head\');
var txt;
txt=\'<div id="wrapper">\';
txt=txt+\'<ul class="tabs">\';
txt=txt+\'<li id="fixtures_tab"><a href="#fixtures">Hepsi</a></li>\';
txt=txt+\'<li id="live_tab"><a href="#live">Canlı</a></li>\';
txt=txt+\'<li id="finished_tab"><a href="#finished">Bitmiş</a></li>\';
txt=txt+\'<li id="program_tab"><a href="#program">Başlamamış</a></li>\';
txt=txt+\'<li id="postpond_tab"><a href="#postpond">Ertelenen</a></li>\';
txt=txt+\'<li id="selected_tab"><a id="f" href="#fav">Oyunlarım (0)</a></li>\';
txt=txt+\'</ul>\';
txt=txt+\'<div class="tab-container">\';
txt=txt+\'<div id="fixtures" class="tab-content"><script type="text/javascript">get_All_Today_Matches();</script></div>\';
txt=txt+\'<div id="live" class="tab-content"><script type="text/javascript"></script></div>\';
txt=txt+\'<div id="finished" class="tab-content"><script type="text/javascript"></script></div>\';
txt=txt+\'<div id="program" class="tab-content"><script type="text/javascript"></script></div>\';
txt=txt+\'<div id="postpond" class="tab-content"><script type="text/javascript"></script></div>\';
txt=txt+\'<div id="fav" class="tab-content"><script type="text/javascript"></script></div>\';
txt=txt+\'</div>\';
txt=txt+\'</div>\';
$(\'#widget-container\').html(txt);
});
}
})(); // We call our anonymous function immediately
对于第三个错误,我使用了如下ajax请求:
function get_All_Today_Matches()//this function used to get all the matches of today for all countries & comptions (live, finished, program) on the main page
{
$.ajax({//ajax function to get the xml data (faster)
type: "POST",//we use POST method beacuse we should send a \'home\' to the proxy page to get the right xml url
url: "http://localhost/aaa/proxy.php",//proxy page
data : {country : \'home\'},//parameters
dataType: "xml",//returned data type
success: parseToday//the function on success
});
}
编辑:4。未捕获的TypeError:对象[对象对象]的属性“$”不是函数
SO网友:Ralf912
您的前两个问题:$
和jQuery
未定义。$
只是的别名jQuery
. 您的前两个问题是相同的,但名称不同。
我认为您没有在functions.php
. 我认为您只需将代码放在模板文件中,并期望它能够正常工作。这基本上就是问题所在。
当您请求jQuery时,它不会被加载。jQuery通常加载在页脚中,这意味着after 您尝试访问jQuery。我们可以用排队的JavaScript很容易地解决这个问题
add_action( \'init\', \'enqueue_skormix_widget_js\', 20 );
function enqueue_skormix_widget_js() {
wp_enqueue_script(
\'skormix-widget\',
\'http://skormix.com/mywidget/widget.js\',
array( \'jquery\' ),
false,
true
);
}
将这行代码放入
functions.php
并移除
<script>
模板中的标记。该函数将挂接在
init
钩子(一个非常早期的钩子)并将您的脚本和依赖项排队
jquery
并将其加载到页脚中。
依赖项告诉WordPress加载脚本after 将加载Dependencity(或dependencies)。在这种情况下,它将在jQuery加载后加载。
现在我们解决了两个问题。jquery
这是alias$
已定义。
让我们仔细看看你的最后一个问题:有些东西不是未定义的函数。当然,如果$
没有定义,不能调用它的方法。在我们定义之后$
propper将脚本排入队列,$
不再是未定义的。
一个简单的RTFM 问题