首页 > 代码库 > JQuery插件编写
JQuery插件编写
插件代码：
/** * 分页插件 * */(function($) { function showData(container){ console.info("方法调用"); var setting = $(container).data("setting"); console.info(setting); setting.pageing(); console.info("xxxx"); setting.paged(); } $.fn.pager = function(setting) { var c=$(this); console.info("插件执行"); var defaultSetting = { //分页前执行 pageing:function(){ console.info("覆盖前paging"); }, //分页后执行 paged:function(){ console.info("覆盖前paged"); } }; console.info(defaultSetting); console.info(setting); console.info("覆盖前调用"); defaultSetting.pageing(); defaultSetting.paged(); //参数覆盖后存入对象 var result= $.extend(true,{},defaultSetting,setting); console.info(result); console.info("覆盖后调用"); result.pageing(); //存入缓存 $(container).data("setting",result); $(c).find(".opSearch").click(function(){ showData(c); }); console.info(c.html()); }; $.fn.pager.reflesh=function(){ console.info("子方法调用"); var setting = $(container).data("setting"); console.info(setting); setting.pageing(); console.info("xxxx"); setting.paged(); }; })(jQuery);
调用代码：
<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title></title> <script src="js/jquery-1.8.2.js"></script> <script src="js/jquery.myPlugin.js"></script> <script type="text/javascript"> $(document).ready(function(){ var setting = { pageing:function(){ console.info("覆盖后paging"); } }; $("#container").pager(setting); $(".sub").click(function(){ $("#container").pager.reflesh(); }); }); </script> </head> <body> <div id="container"> <div> <a class="opSearch">查询</a> <a class="sub">子方法条用</a> </div> </div> </body></html>
JQuery插件编写
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。