`

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中$(function()的用法

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

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

    Jquery中$与$.fn的区别实例.zip

    在jQuery库中,`$`和`$.fn`都是核心组成部分,但它们有着不同的用途和功能。理解这两者的差异对于深入学习和使用jQuery至关重要。本文将详细解释`$`和`$.fn`的区别,并通过实例来帮助你更好地掌握它们。 首先,`$`...

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

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

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

    在JavaScript的世界里,jQuery库为开发者提供了方便的方式来处理DOM(文档对象模型)的加载和交互。`jQuery(document).ready()`函数是jQuery中的一个重要概念,它确保了在执行任何JavaScript代码之前,DOM已经完全...

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

    在JavaScript世界中,jQuery是一个非常流行的库,它简化了DOM操作和事件处理。在jQuery的代码中,我们经常看到一种特殊的语法结构 `(function($){})(jQuery)`,这被称为立即执行函数表达式(IIFE,Immediately ...

    Jquery实现$.fn.extend和$.extend函数_.docx

    在JavaScript中,jQuery库提供了两种扩展对象的方法,即`$.fn.extend`和`$.extend`。它们都用于增加或修改现有对象的功能,但应用场景不同。本文将深入解析这两种方法的实现原理和用途。 首先,`$.fn.extend`是用于...

    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”); // ...

    ajaxFileUpload 报这错jQuery.handleError is not a function

    总的来说,解决"jQuery.handleError is not a function"错误的关键在于理解和适应jQuery的版本变化,以及正确地处理AJAX请求中的错误。确保你的代码和所依赖的库保持更新,可以避免很多类似的问题。同时,利用社区...

    JQuery的$和其它JS发生冲突的快速解决方法

    但当同时使用JQuery和其他也使用$符号的JavaScript库时,就会发生冲突。为了防止这种冲突,JQuery提供了一个解决方法,也就是jquery.noConflict()函数。本文将详细介绍如何使用JQuery的jquery.noConflict()函数以及...

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

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

    jQuery自定义简单清爽的confirm确认对话框效果

    通过引入jQuery库和我们的`jquery.confirm.js`,然后在适当的地方调用`customConfirm`方法,例如: ```html <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script> <script src="js/jquery....

    Jquery中$.post和$.ajax的用法小结

    `$.post`和`$.ajax`是jQuery中用于实现Ajax(异步JavaScript和XML)请求的两个关键方法,它们允许我们在不刷新整个页面的情况下更新网页的部分内容,提高用户体验。 `$.post`是`$.ajax`的一个简化版本,主要用来...

    jquery $.fn.extend

    `$.fn.extend`是jQuery库中的一个核心方法,主要用于...结合事件处理,我们可以创建出强大的、符合项目需求的自定义功能,让jQuery更加灵活和强大。在实际开发中,善用`$.fn.extend`可以极大地提升开发效率和代码质量。

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

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

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

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

    jQuery在header中设置请求信息的方法

    jquery是js的类库,js本身不能操作header,因为js是在浏览器加载页面过程中才开始执行的header需要服务器端执行操作 如果是ajax,是可以设置header $.ajax({ url: "", data: {}, type: "GET", beforeSend: ...

    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; ...

Global site tag (gtag.js) - Google Analytics