Jquery自定义扩展方法(一)

jquery是一款流行的JS框架,自定义JS方法,封装到Jquery中,调用起来也挺方便的,怎么写Jquery扩展方法那,网上翻阅了一部分代码,其实也挺简单的:

方式一:

复制代码
(jQuery.fn.setApDiv=function () {
        //apDiv浮动层显示位置居中控制
        var wheight=$(window).height();
        var wwidth=$(window).width();
        var apHeight=wheight-$("#apDiv").height();
        var apWidth=wwidth-$("#apDiv").width();
        $("#apDiv").css("top",apHeight/2);
        $("#apDiv").css("left",apWidth/2);
    })
或者:
(function ($) {
        $.fn.extend({
            //弹窗蒙层
         ShowLoadDialog : function () {
        //apDiv浮动层显示位置居中控制
        var wheight=$(window).height();
        var wwidth=$(window).width();
        var apHeight=wheight-$("#apDiv").height();
        var apWidth=wwidth-$("#apDiv").width();
        $("#apDiv").css("top",apHeight/2);
        $("#apDiv").css("left",apWidth/2);
             }
        })
})(jQuery)    
复制代码

调用代码:

$("#apDiv").setApDiv();

方式二:

复制代码
  jQuery.extend({
              // 设置 apDiv
            setApDiv:function () {
            //apDiv浮动层显示位置居中控制
            var wheight=$(window).height();
            var wwidth=$(window).width();
            var apHeight=wheight-$("#apDiv").height();
            var apWidth=wwidth-$("#apDiv").width();
            $("#apDiv").css("top",apHeight/2);
            $("#apDiv").css("left",apWidth/2);
            }
      });    
或者:
(function ($) {
        $.extend({
            //弹窗蒙层
            ShowLoadDialog : function () {
              // 设置 apDiv
            setApDiv:function () {
            //apDiv浮动层显示位置居中控制
            var wheight=$(window).height();
            var wwidth=$(window).width();
            var apHeight=wheight-$("#apDiv").height();
            var apWidth=wwidth-$("#apDiv").width();
            $("#apDiv").css("top",apHeight/2);
            $("#apDiv").css("left",apWidth/2);
            }
     })})(jQuery)
复制代码

调用代码:

$.setApDiv();

 三、扩展:

jQuery中Ajax提交,针对Form窗体,我们采用的方式就是去除input值,然后组成Json或者其他方式提交,如果重复的用$("#vid").val(),这种方式处理,显得很繁琐,能不能用其他发送提交表单那,查阅资料之后,发现有个map方法,可以解决问题,代码粘贴如下:

复制代码
$.ajax({
   var str_data=$("#dlg_form input").map(function(){
  return ($(this).attr("name")+'='+$(this).val());
}).get().join("&") ;
   type: "POST",
   url: "some.php",
   data: str_data,
   success: function(msg){
     alert( "Data Saved: " + msg );
   }
});
复制代码

参考不错的博客文章地址:http://www.cnblogs.com/nangong/archive/2013/07/23/3208302.html

 

posted @   jiajinhao  阅读(7953)  评论(2编辑  收藏  举报
编辑推荐:
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
阅读排行:
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构
点击右上角即可分享
微信分享提示