zoukankan      html  css  js  c++  java
  • jQuery两种扩展插件的方式

     1 <!DOCTYPE HTML>
     2 <html>
     3 <head>
     4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
     5 <title>无标题文档</title>
     6 <style>
     7 #div1{ 100px; height:100px; background:red; position:absolute;}
     8 </style>
     9 <script src="jquery-1.10.1.min.js"></script>
    10 <script>
    11 
    12 //$.extend : 扩展工具方法下的插件形式  $.xxx() $.yyy()
    13 
    14 //$.fn.extend  :  扩展到JQ对象下的插件形式  $().xxx()  $().yyy()
    15 
    16 $.extend({
    17     leftTrim : function(str){
    18         return str.replace(/^s+/,'');
    19     },
    20     rightTrim : function(){},
    21     aaa : function(){
    22         alert(1);
    23     },
    24     bbb : function(){}
    25 });
    26 
    27 $.fn.extend({
    28     
    29     drag : function(){
    30         
    31         //this : $('#div1')
    32         
    33         var disX = 0;
    34         var disY = 0;
    35         
    36         var This = this;
    37         
    38         this.mousedown(function(ev){
    39             
    40             disX = ev.pageX - $(this).offset().left;
    41             disY = ev.pageY - $(this).offset().top;
    42             
    43             $(document).mousemove(function(ev){
    44                 
    45                 This.css('left' , ev.pageX - disX);
    46                 This.css('top' , ev.pageY - disY);
    47                 
    48             });
    49             
    50             $(document).mouseup(function(){
    51                 $(this).off();
    52             });
    53             
    54             return false;
    55             
    56         });
    57         
    58     },
    59     aaa : function(){
    60         alert(2);
    61     }
    62     
    63 });
    64 
    65 
    66 </script>
    67 <script>
    68 
    69 
    70 //$.trim()
    71 //$.leftTrim()
    72 
    73 /*var str = '  hello  ';
    74 
    75 alert( '('+$.leftTrim(str)+')' );*/
    76 
    77 $(function(){
    78     
    79     $('#div1').drag();
    80     
    81 });
    82 
    83 
    84 $.aaa();  // 1
    85 $().aaa();  //2
    86 
    87 </script>
    88 </head>
    89 
    90 <body>
    91 <div id="div1"></div>
    92 </body>
    93 </html>
  • 相关阅读:
    Balanced Binary Tree
    Swap Nodes in Pairs
    Reverse Nodes in k-Group
    Reverse Linked List II
    Remove Nth Node From End of List
    Remove Duplicates from Sorted List II
    Remove Duplicates from Sorted List
    Partition List
    Merge Two Sorted Lists
    【Yii2.0】1.2 Apache检查配置文件语法
  • 原文地址:https://www.cnblogs.com/wanqiu/p/4488543.html
Copyright © 2011-2022 走看看