js报TypeError $(...) is null错误,jquery失效的原因及解决办法——w3cdream|前端学习-开发

'I'm W3cdream,创造',前·所·未·有
js报TypeError $(...) is null错误,jquery失效的原因及解决办法

发布作者:萧强   发布时间:2015-09-17   阅读次数:7582

       最近在工作中发现个问题,原本好好的网页,写了一些自己的jquery代码之后,竟然总是不起作用,无论写的多么简单,都不起作用,似乎jquery失效了一般,在火狐下调试看了下,页面报TypeError $(...) is null这种错误,找了半天原因最后发现竟是页面中加载的一个插件给捣的鬼,是它将jquery的$方法给覆盖了。对于这个问题,现在分享两种解决方法。

(1)删冲突插件,jquery作为基础库,当然是没有理由被删了。这个方法最直接了。

(2)将jquery的$方法改名,具体改名方法如下:

jQuery.noConflict();//将变量$的控制权让渡给给其他插件或库
jQuery(function(){//不在直接使用$,而是使用jQuery
    jQuery("p").click(function(){
        alert( jQuery(this).text() );
    });
});
当然如果你感觉jquery写起来比较累,还可以这么写:

var $phpernote=jQuery.noConflict();//自定义一个比较短快捷方式
$phpernote(function(){//使用jQuery
    $phpernote("p").click(function(){
        alert( $phpernote(this).text() );
    });
});
希望对后面遇到此困难的问题有所帮助。

W3C梦想站:http://www.w3cdream.com/content-sort-5-article-479.html

常用昵称:萧强,全端布道者

姓名:“刘晓强”,W3CDream创始人,目前就职于易点付。专注于web前端和移动端方面知识的研究,熟练掌握photoshop和AI,喜爱Flat UI设计和Metro UI风格,熟练掌握CSS3+HTML5技术、LESS CSS和Sass CSS,还有jQuery框架方面及一些前端框架bootstrap响应式设计等。新浪微博
友荐云推荐

JQuery新手练习场

热点文章

新闻资讯

标签云

友情赞助