jquery 自定义函数方法

最新推荐文章于 2025-07-16 12:36:08 发布

转载最新推荐文章于 2025-07-16 12:36:08 发布 · 1.2w 阅读

文章标签：

#jquery

JQuery 专栏收录该内容

35 篇文章

订阅专栏

本文介绍了在jQuery中如何自定义方法，包括直接扩展jQuery原型的方法、扩展jQuery静态方法以及带参数处理的方法。并通过示例展示了这些自定义方法的具体实现及调用方式。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

总结：

* jQuery中添加自定义或函数方法1,如 $.fn.extend({'aa':function(){}}) 或 jQuery.fn.aa=function(){}, 这种调用时就得这样,$("#**").aa()

*jQuery中添加自定义或函数方法2,如$.extend({'aa':function(){}}),这种调用时就是这样$.aa()

* jQuery中添加自定义或函数方法3,（只是在前2种方法的基础上添加了参数处理，严格来说不算一种jQuery 自定义方法）如:　　 $.myFuncThree("www.baidu.com",'hello',myFuncThreeCB);

<html>

    <head>

        <meta charset="utf-8"
 />

        <title></title>

    </head>

    <body >

         <input type="button"
 value="按钮" id="myBtn"  >

    </body>

    <script src="js/jquery-2.1.4.js"
 type="text/javascript" charset="utf-8"></script>

    <script type="text/javascript">

        $(function(){

        })

        /**

         *
 jQuery中添加自定义或函数方法1,如$.fn.extend({'aa':function(){}})或jQuery.fn.aa=function(){},这种调用时就得这样,$("#**").aa()

         */

        jQuery.fn.myFuncOne=function(){

            alert("我的自定义jquery方法1");

        }

        jQuery.fn.extend({

            'myFuncFour':function(){

                alert("我的自定义jquery方法4");

            }

        })

        /**

         *
 jQuery中添加自定义或函数方法2,如$.extend({'aa':function(){}}),这种调用时就是这样$.aa()

         */

        jQuery.extend({

            'myFuncTwo':function(){

                alert("我的自定义jquery方法2");

            }

        })

        /**

         *
 jQuery中添加自定义或函数方法3,如 $.myFuncThree('/post/getsecurejsonpost',{}, function(data) {});

         */

        $.myFuncThree
 = function(url, data, successCB){

            alert("我的自定义jquery方法3,参数："+url);

             if(successCB){//回调

                successCB(url);

             }else{

                alert("没有回调");

             }

        }

        function
 myFuncThreeCB(url){

            alert("myFuncThreeCB+"+url)

        }

        /*

         *
 测试按钮

         */

        $("#myBtn").click(function(){

            $("#myBtn").myFuncOne();

            $("#myBtn").myFuncFour();

            $().myFuncTwo();

            $.myFuncThree("www.baidu.com",'hello',myFuncThreeCB);

            $.myFuncThree("www.baidu.com",'hello');

        })

    </script>

</html>