`

jquery (function($){}) 和 $(function(){})

阅读更多

一、先看 

jQuery(function(){ 
}); 
全写为 
jQuery(document).ready(function(){ 
      
}); 

意义为在DOM加载完毕后执行了ready()方法。 
二、再看 

(function(){ 

})(jQuery); 
其实际上是执行()(para)匿名方法,只不过是传递了jQuery对象。 

三、总结 

jQuery(function(){ });用于存放操作DOM对象的代码,执行其中代码时DOM对象已存在。不可用于存放开发插件的代码,因为jQuery对象没有得到传递,外部通过jQuery.method也调用不了其中的方法(函数)。 
(function(){ })(jQuery);用于存放开发插件的代码,执行其中代码时DOM不一定存在,所以直接自动执行DOM操作的代码请小心使用。

$.fn是指jquery的命名空间,加上fn上的方法及属性,会对jquery实例每一个有效。 
如扩展$.fn.abc() 
那么你可以这样子:$("#div").abc(); 
通常使用extend方法扩展,详细请看API. 

$.fx是指jquery的特效。 
如果使用显示、滑动、淡入淡出、动画等。 
$.fx.off可以关闭动画,其实是直接显示结果。

如:
  (function($) {
    $.fn.jdValidate = function(option, callback, def) {
        var ele = this;
        var id = ele.attr("id");
        var type = ele.attr("type");
        var rel = ele.attr("rel");
        var _onFocus = $("#" + id + validateSettings.onFocus.container);
        var _succeed = $("#" + id + validateSettings.succeed.container);
        var _isNull = $("#" + id + validateSettings.isNull.container);
        var _error = $("#" + id + validateSettings.error.container);
        if (def == true) {
            var str = ele.val();
            var tag = ele.attr("sta");
            if (str == "" || str == "-1") {
                validateSettings.isNull.run({
                    prompts: option,
                    element: ele,
                    isNullEle: _isNull,
                    succeedEle: _succeed
                }, option.isNull);
            } else if (tag == 1 || tag == 2) {
                return;
            } else {
                callback({
                    prompts: option,
                    element: ele,
                    value: str,
                    errorEle: _error,
                    succeedEle: _succeed
                });
            }
        } else {
            if (typeof def == "string") {
                ele.val(def);
            }
            if (type == "checkbox" || type == "radio") {
                if (ele.attr("checked") == true) {
                    ele.attr("sta", validateSettings.succeed.state);
                }
            }
            switch (type) {
                case "text":
                case "password":
                    ele.bind("focus", function() {
                        var str = ele.val();
                        if (str == def) {
                            ele.val("");
                        }
                        validateSettings.onFocus.run({
                            prompts: option,
                            element: ele,
                            value: str,
                            onFocusEle: _onFocus,
                            succeedEle: _succeed
                        }, option.onFocus);
                    })
					.bind("blur", function() {
					    var str = ele.val();
					    if (str == "") {
					        ele.val(def);
					    }
					    if (validateRules.isNull(str)) {
					        validateSettings.isNull.run({
					            prompts: option,
					            element: ele,
					            value: str,
					            isNullEle: _isNull,
					            succeedEle: _succeed
					        }, "");
					    } else {
					        callback({
					            prompts: option,
					            element: ele,
					            value: str,
					            errorEle: _error,
					            isNullEle: _isNull,
					            succeedEle: _succeed
					        });
					    }
					});
                    break;
                default:
                    if (rel && rel == "select") {
                        ele.bind("change", function() {
                            var str = ele.val();
                            callback({
                                prompts: option,
                                element: ele,
                                value: str,
                                errorEle: _error,
                                isNullEle: _isNull,
                                succeedEle: _succeed
                            });
                        })
                    } else {
                        ele.bind("click", function() {
                            callback({
                                prompts: option,
                                element: ele,
                                errorEle: _error,
                                isNullEle: _isNull,
                                succeedEle: _succeed
                            });
                        })
                    }
                    break;
            }
        }
    }
})(jQuery);

分享到:
评论

相关推荐

    jquery 用法 (function($) {})(jQuery);的用法

    页面前端 jquery 用法 (function($) {})(jQuery);的用法

    怎样理解(function($){...})(jQuery)

    本示例主要用于揭示Jquery中的(function($){...})(jQuery),欢迎下载!!!相关博客:http://blog.csdn.net/gaohuanjie/article/details/38268831

    jQuery中(function($){})(jQuery)详解

    本文通过具体示例向大家详细介绍了jQuery中的(function($){})(jQuery)的用法和意义,对此有相同困惑的小伙伴可以参考下本文。

    jQuery(document).ready(function($) { });的几种表示方法

    在写jquery的时候,因为平时用sublime text快捷键生成jQuery(document).ready(function($) { });,所以忘记了其他的几种表示方法,今天花了几分钟特意记录了一下。

    Jquery $when done then的用法详解

    对于$.ajax请求来说,如果层级比较多,程序看起来会比较乱,而为了解决这种问题,才有了$...success: function (data) { $.ajax({ url: /home/GetProduct, dataType: JSON, type: GET, success: function (data) { $.a

    Jquery中$(document).ready(function(){ })函数的使用详解

    jQuery(document).ready(function(){}); 使用jQuery的好处是它包装了各种浏览器版本对DOM对象(javascript的DOM对象你应该知道吧,就是它了)的操作. 比如jquery写法:$(“div p”); // (1)$(“div.container”); // ...

    jQuery使用$.get()方法从服务器文件载入数据实例

    本文实例讲述了jQuery使用$.get()方法从服务器文件载入数据。分享给大家供大家参考。具体如下: <!DOCTYPE html> <html> <head> [removed] [removed] [removed] $(document).ready(function(){ $...

    Jquery简单的弹出层带遮罩插件

    Jquery简单的弹出层带遮罩插件本文由梦三秋于2011年01月07日 23:00作成 jquery代码 $("#test1").click(function(){ $('#login').skygqbox(); }); -----------------------------------------------------...

    jQuery中$原理实例分析

    为了避免声明了一些全局变量而污染,把代码放在一个“沙箱执行”,jQuery具体的实现,都被包含在了一个立即执行函数构造的闭包里面,然后在暴露出命名空间(可以为API,函数,对象),如只暴露 $ 和 jQuery 这2个...

    jquery中$.fn和图片滚动效果实现的必备知识总结

    前言 图片滚动效果相信对大家来说都不陌生,烂大街的效果图... init:function(selector,context){ /* *code */ } } 所以说jquery.fn也就是jquery.prototype的简写。我们的源码调用的构造函数jquery()实例实际是j

    jQuery中$.each使用详解

    主要介绍了jQuery中$.each使用详解,需要的朋友可以参考下

    jQuery中$(function() {});问题详解

    $(function() {});是$(document).ready(function(){ })的简写,最早接触的时候也说$(document).ready(function(){ })这个函数是用来取代页面中的[removed];但是今天发现 好像不是这样回事!是在做一个页面载入效果时...

    利用JQuery直接调用asp.net后台的简单方法

    利用JQuery的$.ajax()可以很方便的调用asp.net的后台方法。 [WebMethod] 命名空间 1、无参数的方法调用, 注意:1.方法一定要静态方法,而且要有[WebMethod]的声明 后台<C>: using System.Web.Script.Services; ...

    jquery.table2excel.js

    jquery.table2excel.js,一款挺好用的javascript导出插件,需要jquery-1.7.1.min.js的支持。使用方法: $(document).ready(function() { //导出excel $("#output").click(function(){ var myDate = new Date(); ...

    js原生态函数中使用jQuery中的 $(this)无效的解决方法.docx

    在JavaScript开发中,使用jQuery的$(this)在原生态函数中可能会出现无效的问题,本文将对此进行详细的分析和解决方法的介绍。 一、问题描述 在JavaScript开发中,我们经常使用jQuery来简化我们的代码,但是当我们...

    jquery手冊--jquery.chm

    jQuery $(Function fn) $(document)的简写方式。 jQuery $(String expr,Element|jQuery context) 这个函数接收一个包含CSS或基本的XPath选择符的字符串,然后用这个字符串去匹配一组元素。 jQuery $.extent(Object...

    jQuery中$this和$(this)的区别介绍(一看就懂)

    // 而$(this)是个转换,将this表示的dom对象转为jquery对象,这样就可以使用jquery提供的方法操作。 (function($){ $.fn.hilight = function(options){ debug(this); var defaults = { foreground: 'red', ...

    jquery中的工具使用方法$.isFunction, $.isArray(), $.isWindow()

    当然,jquery除了提供$.type的工具方法外,还提供了几个其他的工具方法:$.isFunction(), $.isArray(), $.isWindow(), $.isNumeric()等。这几个方法从方法名上就能看出其用途来,下面我们来一一讲解这几个方法在...

    seajs加载jquery时提示$ is not a function该怎么解决

    jquery1.7以上的都支持模块化加载,只是jquery默认的是支持amd,不... define( "jquery", [], function() { return jQuery; }); } 改成 if (typeof define === "function" && (define.amd || define.cmd)) { defi

    jQuery中$.click()无效问题分析

    我尝试过多次用jQuery模拟用户点击a标签的功能,但都没有成功,并且困扰了很久。前段时间的一次发呆,冒出了新的想法,于是就动手进行了测试。 先看下边的代码: 代码如下:  <html> <head>磨途歌-A...

Global site tag (gtag.js) - Google Analytics