JQuery 自定义函数
1、前言
像我这样没有经过系统学习前端的同学,对jquery的理解估计还只是停留在基本的使用上,在这里抽出时间梳理下,jquery自定义方法,以及基本的调用,毕竟在网上用了那么多jquery第三方插件,却还不知道怎么定义的。
2、自定义函数及其使用示例
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
</head>
<body>
<input type="button" value="按钮" id="myBtn">
</body>
<script src="js/jquery-3.2.1.min.js"></script>
<script type="text/javascript">
$(function(){
//$("button").myFuncOne();
$("button").myFuncFour();
$.myFuncTwo();
})
/**
* 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>
版权声明:本文为qq_36441169原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。