jquery分页插件调用报错的问题:$(.).pagination is not a function

发布时间:2019-05-23 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了jquery分页插件调用报错的问题:$(.).pagination is not a function脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

问题描述:
分页插件jquery.pagination.js第一次初始化时分页可用,后续再调用分页则报错$(.).pagination is not a function的问题。
注意:在调用基于jQuery扩展的插件时,不能重复引用jQuery。
例如:首先引入jQuery-1.js,然后引入基于jQuery的插件(jquery.pagination.js),然后再次引入了jQuery-2.js文件。这样的做法就是不正确的。
因为此时基于jQuery的插件(jquery.pagination.js)中的函数其实是扩展在第一次引入的jQuery-1.js对象上的,而在第二次引入的jQuery-2.js文件加载完成之后会覆盖jQuery-1.js,后续调用的jQuery方法其实都是第二次引入的jQuery-2.js文件中的方法,此时的jquery对象上没有插件的扩展方法。


以下代码详细讲解了整个js的执行过程:

<!DOCTYPE htML>
<html>
<head>
<meta charset="utf-8">
<script src="jquery-1.js"></script>
<script src="jquery.pagination.js"></script>
</head>
<body>
    <div id="page1"></div>
    <div id="page2"></div>
    <div id="page3"></div>
    <button type="button" id="btn"></button>
    
    <script>
    var page1 = $('#page1');//jquery-1对象
    $('#page2').pagination();//能正确调用
    
    console.log($.fn.jquery);//jquery-1的版本号
    console.log($.fn.pagination);//pagination扩展函数
    
    $('#btn').click(function(){
        console.log($.fn.jquery);//jquery-2的版本号
        console.log($.fn.pagination);//undefined
        
        page1.pagination();//能正确调用。 $.fn.pagination扩展在了jquery-1上
        $('#page3').pagination();//报错。jquery-2已覆盖jquery-1,此时调用的是jquery-2上的方法得到jquery-2对象
    });
</script>
    <script src="jquery-2.js"></script>
</body>
</html>



总结:在调用基于jQuery扩展的插件时,注意不要重复引用jQuery。

脚本宝典总结

以上是脚本宝典为你收集整理的jquery分页插件调用报错的问题:$(.).pagination is not a function全部内容,希望文章能够帮你解决jquery分页插件调用报错的问题:$(.).pagination is not a function所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。