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

$(document).ready() 里的代码是在页面内容都加载完才执行的，如果把代码直接写到script标签里，当页面加载完这个script标签就会执行里边的代码了，此时如果你标签里执行的代码调用了当前还没加载过来的代码或者dom，那么就会报错，当然如果你把script标签放到页面最后面那么就没问题了，此时和ready效果一样。

$(document).ready(function(){})可以简写成$(function(){});

点击段落后，此段落隐藏：

<html>
<head>
<script src="http://libs.baidu.com/jquery/1.9.0/jquery.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){
 $("p").click(function(){
  $(this).hide();
 });
});
</script>
</head>

<body>
 <p>If you click on me, I will disappear.</p>
</body>
</html>

如果把$(document).ready(function() {});去掉后，无法隐藏段落：

<html>
<head>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
 $("p").click(function(){
  $(this).hide();
 });
</script>
</head>

<body>
 <p>If you click on me, I will disappear.</p>
</body>
</html>

但是把script放到页面最后的话，就可恢复隐藏效果：

<html>
<head>
</head>

<body>
 <p>If you click on me, I will disappear.</p>
</body>

<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript">
 $("p").click(function(){
   $(this).hide();
 });
</script>
</html>

总结：

$(document).ready 里的代码是在页面内容都加载完才执行的，你直接写到script标签里，当页面加载完这个script标签就会执行里边的代码了，如果你标签里执行的代码调用了当前还没加载过来的代码或者dom，那么就会报错，
当然如果你把script标签当到页面最后面那么就没问题了和ready差不多的效果

赞 (0)

相关推荐

  • 使用.NET中的Action及Func泛型委托深入剖析

    使用.NET中的Action及Func泛型委托深入剖析

    委托,在C#编程中占有极其重要的地位,委托可以将函数封装到委托对象中,并且多个委托可以合并为一个委托,委托对象则可以像普通对象一样被存储.传递,之后在任何时刻进行调用,因此,C#中函数回调机制的实现基本上依赖于委托.C#的delegate关键字用于声明委托,它具有将声明委托类型映射到System.Delegate类的能力,System.Delegate类位于mscorlib.dll中,是.NET的基础核心类之一.使用delegate关键字声明一个委托,实质上创建了System.Delegate的

  • JavaScript获取function所有参数名的方法

    我写了一个 JavaScript函数来解析函数的参数名称, 代码如下: function getArgs(func) { // 先用正则匹配,取得符合参数模式的字符串. // 第一个分组是这个: ([^)]*) 非右括号的任意字符 var args = func.toString().match(/function\s.*?\(([^)]*)\)/)[1]; // 用逗号来分隔参数(arguments string). return args.split(",").map(functi

  • Android 广播大全 Intent Action 事件详解

    具体内容如下所示: Intent.ACTION_AIRPLANE_MODE_CHANGED; //关闭或打开飞行模式时的广播 Intent.ACTION_BATTERY_CHANGED; //充电状态,或者电池的电量发生变化 //电池的充电状态.电荷级别改变,不能通过组建声明接收这个广播,只有通过Context.registerReceiver()注册 Intent.ACTION_BATTERY_LOW; //表示电池电量低 Intent.ACTION_BATTERY_OKAY; //表示电池电

  • FloatingActionButton增强版一个按钮跳出多个按钮第三方开源之FloatingActionButton

    FloatingActionButton增强版一个按钮跳出多个按钮第三方开源之FloatingActionButton

    FloatingActionButton项目在github上的主页:https://github.com/futuresimple/android-floating-action-button FloatingActionButton使用简单,而且可以自定义颜色.大小.背景图片 项目构造: 下面是demo的代码(主要见sample): 布局: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android&

  • 动态设置form表单的action属性的值的简单方法

    用jQuery时,可如下设置: form表单: <form name="myform" id="myform" action="ssss" method="post" onsubmit="getUrl();"> javascript方法: <script type="text/javascript"> function getUrl(){ $('form').at

  • 详解Func<T>与Action<T>区别

    Func<T>.Action<T> 的区别于说明 一.Func Func是一个.Net内置的委托. Func<Result>,Func<T1,Result>是一个.Net内置的泛型委托. Func<TResult> Func<T,TResult> Func<T1,T2,TResult> Func<T1,T2,T3,TResult> Func<T1,T2,T3,T4,TResult> 它有5种形式,只

  • JavaScript function函数种类详解

    本篇主要介绍普通函数.匿名函数.闭包函数 目录 普通函数:介绍普通函数的特性:同名覆盖.arguments对象.默认返回值等. 匿名函数:介绍匿名函数的特性:变量匿名函数.无名称匿名函数. 闭包函数:介绍闭包函数的特性. 1. 普通函数 1.1 示例 function ShowName(name) { alert(name); } 1.2 Js中同名函数的覆盖 在Js中函数是没有重载,定义相同函数名.不同参数签名的函数,后面的函数会覆盖前面的函数.调用时,只会调用后面的函数. var n1 =

  • 用JS动态改变表单form里的action值属性的两种方法

    方法1: <form id="form1" name="form1" method="post" action="../news/index.asp"> <table width="100%" height="43" border="0" cellpadding="0" cellspacing="0">

  • Javascript自执行匿名函数(function() { })()的原理浅析

    函数是JavaScript中最灵活的一种对象,这里只是讲解其匿名函数的用途.匿名函数指没有指定函数名或指针的函数,自执行匿名函数只是其中一种,下文中称这种函数为:自执行函数 下面是一个最常见的自执行函数: // 传统匿名函数 (function() { alert('hello'); })(); 这段代码的执行效果就是在页面再载入时弹出:"hello" 是什么促使它自动执行的?,来看下面的代码 // 在传统写法上去掉小括号,并在前面加上运算符 ~,!,+,- ~function(){

  • Codeigniter框架的更新事务（transaction）BUG及解决方法

    由于ci事务判断出错回滚的条件是语句是否执行成功,而更新操作时,就算影响的条数为0,sql语句执行的结果过仍然为1,因为它执行成功了,只是影响的条数为0. 下面介绍解决这个问题的方法: 对于一次要执行许多的语句的事务 只需在更新操作下根据影响条数是否为0来决定是否会滚即可,下面假设第二条语句为更新操作. 复制代码 代码如下: //采用 Codeigniter 事务的手动模式     $this->db->trans_strict(FALSE);     $this->db->tra

  • 深入理解(function(){... })();

    1.他叫做立即运行的匿名函数(也叫立即调用函数) 2.当一个匿名函数被括起来,然后再在后面加一个括号,这个匿名函数就能立即运行起来!有木有很神奇哦~ 3.要使用一个函数,我们就得首先声明它的存在.而我们最常用的方式就是使用function语句来定义一个函数 4.Function 对象 Function对象是JavaScript里面的固有对象,所有的函数实际上都是一个Function对象. 我们先看看,Function对象能不能直接运 用构造函数创建一个新的函数呢?答案是肯定的. var abc

  • javascript中$(function() {});写与不写有哪些区别

    javascript中$(function() {....}) 是 jQuery 中的经典用法,等同于 $(document).ready(function() {....}),即在页面加载完成后才执行某个函数,如果函数中要操作 DOM,在页面加载完成后再执行会更安全,所以在使用 jQuery 时这样的写法很常见. $(document).ready() 里的代码是在页面内容都加载完才执行的,如果把代码直接写到script标签里,当页面加载完这个script标签就会执行里边的代码了,此时如果你标

  • php实现表单多按钮提交action的处理方法

    表单内有两个提交按钮,要实现当点击不同的提交按钮时,分别进行两个不同的处理过程,在这里有实现表单多按钮提交action的处理方法分享给大家. 用PHP判断,一个表单两个按钮,按钮的name属性设为相同,但值设为不同,表单提交后,只需要判断提交上来的值就可以转到不同的处理过程去,这个方法比较合理,适合多个按钮在一个表单里. PHP方法,代码如下: <?php echo "$sub<br>\n"; if ("s1"==$sub) { ... } els

  • 详解在Java的Struts2框架中配置Action的方法

    在Struts2中Action部分,也就是Controller层采用了低侵入的方式.为什么这么说?这是因为在Struts2中action类并不需要继承任何的基类,或实现任何的接口,更没有与Servlet的API直接耦合.它通常更像一个普通的POJO(通常应该包含一个无参数的execute方法),而且可以在内容定义一系列的方法(无参方法),并可以通过配置的方式,把每一个方法都当作一个独立的action来使用,从而实现代码复用. 例如: package example; public class U

  • 详解Python中的装饰器、闭包和functools的教程

    装饰器(Decorators) 装饰器是这样一种设计模式:如果一个类希望添加其他类的一些功能,而不希望通过继承或是直接修改源代码实现,那么可以使用装饰器模式.简单来说Python中的装饰器就是指某些函数或其他可调用对象,以函数或类作为可选输入参数,然后返回函数或类的形式.通过这个在Python2.6版本中被新加入的特性可以用来实现装饰器设计模式. 顺便提一句,在继续阅读之前,如果你对Python中的闭包(Closure)概念不清楚,请查看本文结尾后的附录,如果没有闭包的相关概念,很难恰当的理解P

  • C#中Action和Func的区别

    本文实例分析了C#中Action和Func的区别,有助于读者牢固掌握并对其准确使用.具体分析如下: 先来看下面这段代码: //测试使用的公共值 int num = 10; //测试Func委托 Func<int, int> f; f = (int tempf) => { return tempf + 1; }; Response.Write(f(num).ToString()+"<br />"); //调用f委托,并打印相应的值! //测试Action委托

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

    jquery1.7以上的都支持模块化加载,只是jquery默认的是支持amd,不支持cmd.所以要用seajs加载jquery时,我们需要稍微做下改动,需要把以下内容做下修改,具体修改方式如下: 把 if (typeof define === "function" && (define.amd)) { define( "jquery", [], function() { return jQuery; }); } 改成 if (typeof defin

  • js立即执行函数: (function ( ){})( ) 与 (function ( ){}( )) 有什么区别?

    没有区别. 你需要明白 IIFE 的原理,我简单说一下: 复制代码 代码如下: function foo() {...}     // 这是定义,Declaration:定义只是让解释器知道其存在,但是不会运行. foo();                   // 这是语句,Statement:解释器遇到语句是会运行它的. IIFE 并非必须,传统一点可以这么写: 复制代码 代码如下: function foo() {...} foo(); 那么为什么要 IIFE? 1.传统的方法啰嗦,定义

  • SQL Function 自定义函数详解

    SQL Function 自定义函数详解

    目录 产生背景(已经有了存储过程,为什么还要使用自定义函数) 发展历史 构成 使用方法 适用范围 注意事项 疑问 内容 产生背景(已经有了存储过程,为什么还要使用自定义函数) 与存储过程的区别(存在的意义): 1.     能够在select等SQL语句中直接使用自定义函数,存储过程不行. 2.     自定义函数可以调用其他函数,也可以调用自己(递归) 3.     可以在表列和 CHECK 约束中使用自定义函数来实现特殊列或约束 4.       自定义函数不能有任何副作用.函数副作用是指对

  • PHP register_shutdown_function()函数的使用示例

    通过 register_shutdown_function 方法,可以让我们设置一个当执行关闭时可以被调用的另一个函数. 也就是说,当我们的脚本执行完成或者意外死掉导致 php 执行即将关闭时,我们的这个函数会被调用. [使用场景] ① 页面被(用户)强制停止 ② 程序代码意外终止或超时 ③ php4 中没有析构函数,可以使用该函数模拟析构函数 shutdown.php <?php header("content-type:text/html;charset=utf-8"); c

随机推荐