文档章节

jquery优雅的自定义函数总结

风清扬-深圳
 风清扬-深圳
发布于 2015/12/08 10:44
字数 314
阅读 1691
收藏 2

方法一:

定义多个方法,将方法统一放到一个对象里,以传递一个字符串为例:

//方法定义 
$.func = {
    //定义一个方法aa 
    aa: function(param) {
        alert("aaaaaa" + param);
    },
    //定义一个方法bb 
    bb: function() {
        alert("bb");
    }
}
$.func.aa('123'); //调用$.func里的aa方法

定义单个方法,ajax异步提交可以如下封装:

$.ajaxPost = function(url, data, callback) {
    $.post(url, data, callback, "json");
};
$.ajaxPost('/post/ajaxUrl',{},function(data){});

方法二:

定义变量的形式自定义函数,传递一个对象做为参数为例:

var test = function(x) {
    //弹出对象 x 里的 a 变量和 b 变量 
    alert(x.a + " 对象传参 " + x.b);
}
$.func = test;
//传递一个对象
$.func({a: "111",b: "222"});

方法三:

以拓展的方式添加函数,如下示例:

$.extend({
    setHtml: function() {
        $("#test").html('2222222222');
    },
    setClick:function(param){
      alert('test'+param);
    }
});
$(function() {
    $.setHtml();
    $.setClick('123');
});

方法四:

选择器传递方式:

$.fn.setHtml=function () { 
    $(this).html('22222222222');
} 
$(function() {
    $("#test").setHtml(); 
});


上述方法测试的HTML代码如下:

<!DOCTYPE html>
<html>
 <head> 
  <meta charset="utf-8" /> 
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 
  <title>Examples</title> 
  <script src="http://lib.sinaapp.com/js/jquery/1.9.1/jquery-1.9.1.min.js"></script> 
  <script type="text/javascript">
    $.fn.setHtml=function () { 
        $(this).html('22222222222');
    } 
    $(function() {
         $("#test").setHtml(); 
    });
</script> 
 </head> 
 <body> 
  <div id="test">11111111</div>  
 </body>
</html>


© 著作权归作者所有

共有 人打赏支持
风清扬-深圳
粉丝 11
博文 73
码字总数 19480
作品 0
深圳
高级程序员
Jquery不同版本共用的解决方案(插件编写)

最近在为某公司做企业内部UI库,经过研究分析和评审,决定基于Jquery开发,结合Bootstrap插件那简洁,优雅,高效的思想进行插件编写。 但是在编写的过程中遇到一个头疼的问题,就是正在编写的...

Eric_HSBC
2013/05/15
0
2
第78天:jQuery事件总结(一)

jQuery事件总结(一)   现在就一点一点积累自己的知识体系,记录自己学到的和自己所理解的jQuery。   JavaScript和HTML之间的交互式通过用户和浏览器操作页面时引发的事件机制来处理的。...

半指温柔乐
2017/11/08
0
0
了解jQuery技巧来提高你的代码

1.测试并提升你的jQuery选择器水平 这个jQuery选择器实验室非常酷,它能在线免费使用,当然你也能下来到本地离线使用。这个测试页面包含复杂的HTML组合字段,然后你能尝试预定义使用各种jQu...

i33
2012/09/25
0
0
自定义jQuery插件Step by Step

自定义jQuery插件Step by Step 1.1.1 摘要 随着前端和后端技术的分离,各大互联网公司对于Mobile First理念都是趋之若鹜的,为了解决网页在不同移动设备上的显示效果,其中一个解决方案就是R...

wolf_su
2013/07/04
0
0
jQuery.noConflict() 函数详解

jQuery.noConflict()函数用于让出jQuery库对变量$(和变量jQuery)的控制权。 一般情况下,在jQuery库中,变量$是变量jQuery的别名,它们之间是等价的,例如jQuery("p")和$("p")是等价的。由于...

鱼煎
2015/07/20
0
0

没有更多内容

加载失败,请刷新页面

加载更多

DeepMind 开源图神经网络的代码

用于支持论文《Relational inductive biases, deep learning, and graph networks》。 github A graph network takes a graph as input and returns a graph as output. The input graph has......

shengjuntu
34分钟前
1
0
python2编码详解、一

以前使用python3没觉的什么,跟着公司使用python2后被编码问题折磨的痛不欲生,好好研究了一下编码问题,参考了很多博文,加入自己的理解,这里只是对编码的介绍,下一篇是python2中编码问题...

hc321
42分钟前
1
0
基于OpenSSL的一些常用加密签名算法

目前包括:MD5、SHA512、DES、RSA加解密、RSA+MD5签名验证算法,在openssl基础上再进行封装,使用简单,头文件需要包含openssl库,可以使用vcpkg自动管理,省去繁琐的配置工程的过程。 该RSA...

LoSingSang
51分钟前
1
0
spring Data JPA

什么是JPA? 全称Java Persistence API,可以通过注解或者XML描述【对象-关系表】之间的映射关系,并将实体对象持久化到数据库中。 为我们提供了: 1)ORM映射元数据:JPA支持XML和注解两种元...

狼王黄师傅
56分钟前
1
0
微信小程序 - 使用七牛云 API 截取第 n 秒图像为封面图

前面分享过七牛的上传操作,在这里说下使用七牛 api 对视频在页面的处理,比如你的视频上传之后获取七牛视频链接,这时候你怎么展示它呢? 在页面可以使用小程序提供的原生组件 video ,可以...

几个栗子
59分钟前
1
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部