jQuery Uncaught TypeError:对象[object Window]的属性'$'不是函数


92

全部,我下载了预捆绑的JS / CSS表单应用程序,并试图在Wordpress中使用它。我有以下代码:

$(document).ready(function () {


/*----------------------------------------------------------------------*/
/* Parse the data from an data-attribute of DOM Elements
/*----------------------------------------------------------------------*/


$.parseData = function (data, returnArray) {
    if (/^\[(.*)\]$/.test(data)) { //array
        data = data.substr(1, data.length - 2).split(',');
    }
    if (returnArray && !$.isArray(data) && data != null) {
        data = Array(data);
    }
    return data;
};

/*----------------------------------------------------------------------*/
/* Image Preloader
/* http://engineeredweb.com/blog/09/12/preloading-images-jquery-and-javascript
/*----------------------------------------------------------------------*/



// Arguments are image paths relative to the current page.
$.preload = function() {
    var cache = [],
        args_len = arguments.length;
    for (var i = args_len; i--;) {
        var cacheImage = document.createElement('img');
        cacheImage.src = arguments[i];
        cache.push(cacheImage);
    }
};


/*----------------------------------------------------------------------*/
/* fadeInSlide by revaxarts.com
/* Fades out a box and slide it up before it will get removed
/*----------------------------------------------------------------------*/


$.fn.fadeInSlide = function (speed, callback) {
    if ($.isFunction(speed)) callback = speed;
    if (!speed) speed = 200;
    if (!callback) callback = function () {};
    this.each(function () {

        var $this = $(this);
        $this.fadeTo(speed / 2, 1).slideDown(speed / 2, function () {
            callback();
        });
    });
    return this;
};


/*----------------------------------------------------------------------*/
/* fadeOutSlide by revaxarts.com
/* Fades out a box and slide it up before it will get removed
/*----------------------------------------------------------------------*/


$.fn.fadeOutSlide = function (speed, callback) {
    if ($.isFunction(speed)) callback = speed;
    if (!speed) speed = 200;
    if (!callback) callback = function () {};
    this.each(function () {

        var $this = $(this);
        $this.fadeTo(speed / 2, 0).slideUp(speed / 2, function () {
            $this.remove();
            callback();
        });
    });
    return this;
};

/*----------------------------------------------------------------------*/
/* textFadeOut by revaxarts.com
/* Fades out a box and slide it up before it will get removed
/*----------------------------------------------------------------------*/


$.fn.textFadeOut = function (text, delay, callback) {
    if (!text) return false;
    if ($.isFunction(delay)) callback = delay;
    if (!delay) delay = 2000;
    if (!callback) callback = function () {};
    this.each(function () {

        var $this = $(this);
        $this.stop().text(text).show().delay(delay).fadeOut(1000,function(){
            $this.text('').show();
            callback();
        })
    });
    return this;
};

/*----------------------------------------------------------------------*/
/* leadingZero by revaxarts.com
/* adds a leding zero if necessary
/*----------------------------------------------------------------------*/


$.leadingZero = function (value) {
    value = parseInt(value, 10);
    if(!isNaN(value)) {
        (value < 10) ? value = '0' + value : value;
    }
    return value;
};


});

我以为Wordpress没有冲突会引起问题,因此我将最后一个括号更新为如下所示:

}, "jQuery");

但是,我仍然遇到相同的错误。有谁知道会导致这个问题的原因以及如何解决它?

提前致谢!

Answers:


260

这是一个语法问题,WordPress随附的jQuery库以“无冲突”模式加载。这是为了防止与WordPress可以加载的其他JavaScript库的兼容性问题。在“无冲突”模式下,$快捷方式不可用,并且使用了更长的jQuery,即

jQuery(document).ready(function ($) {

通过在函数调用后的圆括号中包含$,可以在代码块内使用此快捷方式。

有关详细信息,请参见WordPress Codex。


我应该补充一点,您需要在最后松开“ jQuery”
RedEyedMonster

3
你真是个拯救生命的人!!!经过3天的调试,我发现这是解决我问题的准确方法。尽管WordPress正在加载jQuery文件,但我无法随时访问文档中提到的功能。因此,这行确切的代码即永久jQuery(document).ready(function ($) {修复了它。多谢分享。
Devner,2014年

2
这在Drupal中也是同样的问题。解决方案也在那里。谢谢
Yogesh Gupta 2014年

35

我最喜欢的无冲突友好构造:

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

使用函数指针调用jQuery是$(document).ready(...)的快捷方式

或如我们在coffeescript中所说:

jQuery ($) ->
  # code here

如果$已经是一个jquery实例-是否有任何理由再次传递jQuery并为其$命名?
zerkms,2012年

2
如果$与另一个库发生冲突,则$可能不是jQuery实例-无冲突模式。
朱利安

4
这是通往$(document).ready()(而不是)的捷径$(document).on('load')
凯文·B

这对我有用!我主题中的所有custom.js函数都无法解释。我用它替换了$(document).ready(function(){,它像魔术一样工作:)
Ira Herman


1

您可以考虑通过将以下内容添加到主题functions.php文件中,以用Google库替换默认的WordPress jQuery脚本:

function modify_jquery() {
    if (!is_admin()) {
        wp_deregister_script('jquery');
        wp_register_script('jquery', 'http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js', false, '1.10.2');
        wp_enqueue_script('jquery');
    }
}
add_action('init', 'modify_jquery');

从此处获取的代码:http : //www.wpbeginner.com/wp-themes/replace-default-wordpress-jquery-script-with-google-library/


最佳解决方案,如果您在WP Downside以外使用“外部” JQuery插件:-可以-与某些Wordpress插件冲突-在我这边什么都没注意到
RunsnbunsN 2014年

-1

也许您在jquery之前有这样的代码:

var $jq=jQuery.noConflict();
$jq('ul.menu').lavaLamp({
    fx: "backout", 
    speed: 700
});

他们是冲突

您可以将$更改为(jQuery)


1
我使用它的方式就像var $=jQuery.noConflict();Mine是java-webapp的设置一样,但是我遇到了同样的错误!
—coding_idiot13年
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.