在未加载完文档,使用jquery选择器选择元素后,如果立即绑定事件进行调用,会引起js的报错(can not read property of undefined),导致事件不能绑定成功.

alert($("p")[1].firstChild.nodeValue);

这时就需要js的页面加载函数

一般有三种

window.onload = function(){
$("p").bind("click", function() {
$(this).hide();
})
} $(document).ready(function(){
$("p").click(function(){
$(this).hide();
})
})
$(function(){
$("p").click(function(){
$(this).hide();
})
}) //$(function(){})是 $(document.ready(function(){})) 的简写

另外jQuery绑定事件的方式有两种

一种 是直接 click(callback(){});

一种是使用 bind函数 bind("click",callback(){});

js页面加载函数的更多相关文章

  1. js页面加载完后执行(document.onreadystatechange 和 document.readyState)

    js页面加载完后执行javascript(document.onreadystatechange 和 document.readyState) document.onreadystatechange ...

  2. JS 页面加载触发事件 document.ready和window.onload的区别

    document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onlo ...

  3. JS 页面加载触发事件 document.ready和onload的区别(转)

    原博地址:http://blog.163.com/zhaoyanping_1125/blog/static/20132915320111129113723710/ * document.ready和o ...

  4. js页面加载进度条(这个就比较正式了,改改时间就完事儿)

    不废话,直接上代码 思路不难,就是一个animate方法配合随机数 duration内个三秒钟,是自定义的,可以改成页面加载时间,这样就完美了 <!doctype html> <ht ...

  5. js页面加载进度条

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. js页面加载完成事件

    jquery的一种简写形式: $(function(){ alert("页面加载完成!"); });  其对应的完整形态为: $(document).ready(function( ...

  7. JS 页面加载触发事件 document.ready和onload的区别

    document.ready和onload的区别——JavaScript文档加载完成事件页面加载完成有两种事件: 一是ready,表示文档结构已经加载完成(不包含图片等非文字媒体文件): 二是onlo ...

  8. js页面加载的几种方式的速度: window.onload、 $(window).load、 $(function(){})、 $(document).ready(function () {})、onload=‘asd()’

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. jquery和js的几种页面加载函数的方法以及执行顺序

    参考博客:http://www.cnblogs.com/itslives-com/p/4646790.html    https://www.cnblogs.com/james641/p/783837 ...

随机推荐

  1. 27. Spring Boot 部署与服务配置

    转自“https://www.cnblogs.com/zhchoutai/p/7127598.html” Spring Boot 其默认是集成web容器的,启动方式由像普通Java程序一样,main函 ...

  2. UML学习之用例图

    在UML的整个学习过程中,9种图(用例图.活动图.状态图.顺序图.类图.对象图.协作图.组件图.部署图)的学习以及常用开发.建模工具的使用是最为重要的一个阶段,它是进行UML建模的基础.在本篇文章中首 ...

  3. 获取input file 选中的图片,并在一个div的img里面赋值src实现预览

    代码如下利用html5实现:几乎兼容所有主流浏览器,当然IE必须是IE 6以上 [jquery代码] $(function() { $("#file_upload").change ...

  4. (JavaScript基础向)sort()方法里的排序函数的理解

    比较常见的解释可以看这里:js的sort()方法,这篇博客写得挺好的,一般的应用的理解已经足够了. 但是如果要活用sort()方法里面的参数——也就是排序函数的话,可能就比较难理解了. 然后我就总结出 ...

  5. 【Codeforces Round #431 (Div. 2) C】From Y to Y

    [链接]点击打开链接 [题意] 让你构造一个大小最多为10W的字符multiset. 你进行n-1次操作; 每次操作,从set中取出两个字符串,一开始单个字符被认为是字符串. 然后把它们连接在一起. ...

  6. log4j配置文件及nutch中的日志配置 分类: B1_JAVA 2015-02-17 10:58 483人阅读 评论(0) 收藏

    吐槽几句,log4j的坑啊.... (1)CLASSPATH中不能有多个log4j的版本本,否则有有奇形怪状的NoSuchMethod, NoSuchFiled, NoClassDefineFound ...

  7. centos7.0查看IP

    原文:centos7.0查看IP 输入ip查询命名 ip addr  也可以输入 ifconfig(centOs7没有ifconfig命令)查看ip,但此命令会出现3个条目,centos的ip地址是e ...

  8. C# 进制转换 在什么情况下使用16进制,字节数组,字符串

    C# 进制转换 Admin2013年9月18日 名人名言:从工作里爱了生命,就是通彻了生命最深的秘密.——纪伯伦 1.请问c#中如何将十进制数的字符串转化成十六进制数的字符串 //十进制转二进制Con ...

  9. Spring Boot中的缓存支持(一)注解配置与EhCache使用

    Spring Boot中的缓存支持(一)注解配置与EhCache使用 随着时间的积累,应用的使用用户不断增加,数据规模也越来越大,往往数据库查询操作会成为影响用户使用体验的瓶颈,此时使用缓存往往是解决 ...

  10. 一起talk C栗子吧(第八回:C语言实例--素数)

    各位看官们,大家好,从今天開始.我们讲大型章回体科技小说 :C栗子,也就是C语言实例. 闲话休提, 言归正转. 让我们一起talk C栗子吧! 看官们.上一回中咱们说的是进制转换的样例,这一回咱们说的 ...