jQuery事件之页面框架加载后自动执行
1）概述
HTML执行是按自上而下编译，而<script>一般写在body结束之前。如果在HTML加载的过程中卡住，
比如加载图片等，没有显示出来，就会一直等图片出来，而不向下编译，而前面的HTML标签要使用script，这时候就会不生效。
如何避免这问题，可以使用$(document).ready()事件。即当页面框架加载完毕后，自动执行；而不是当页面所有元素完全加载完毕后，执行。
2）ready(fn)
当DOM载入就绪可以查询及操纵时绑定一个要执行的函数。
这是事件模块中最重要的一个函数，因为它可以极大地提高web应用程序的响应速度。
简单地说，这个方法纯粹是对向window.load事件注册事件的替代方法。通过使用这个方法，
可以在DOM载入就绪能够读取并操纵时立即调用你所绑定的函数，而99.99%的 JavaScript函数都需要在那一刻执行。
有一个参数－－对jQuery函数的引用－－会传递到这个ready事件处理函数中。可以给这个参数任意起一个名字，并因此可以不再担心命名冲突而放心地使用$别名。
请确保在 <body> 元素的onload事件中没有注册函数，否则不会触发+$(document).ready()事件。
可以在同一个页面中无限次地使用$(document).ready()事件。其中注册的函数会按照（代码中的）先后顺序依次执行。
3）使用方法
描述:在DOM加载完成时运行的代码，可以这样写：jQuery 代码:$(document).ready(function(){ ?// 在这里写你的代码...});描述:使用 $(document).ready() 的简写，同时内部的 jQuery 代码依然使用 $ 作为别名，而不管全局的 $ 为何。jQuery 代码:$(function($) { ?// 你可以在这里继续使用$作为别名...});4）例子
<!DOCTYPE html><html lang="en"><head> ???<meta charset="UTF-8"> ???<title>Title</title> ???<style> ???????.error{ ???????????color: red; ???????} ???</style></head><body> ???<form id="f1" action="s5.html" method="POST"> ???????<div><input name="n1" tex = "用户名" type="text" /></div> ???????<div><input name="n2" tex = "密码" type="password" /></div> ???????<div><input name="n3" tex = "邮箱" type="text" /></div> ???????<div><input name="n4" tex = "端口" type="text" /></div> ???????<div><input name="n5" tex = "IP" type="text" /></div> ???????<input type="submit" value="提交" /> ???????<img src="..."> ???</form> ???<script src="jquery-1.12.4.js"></script> ???<script> ???????$(function(){ ???????????// 当页面所有元素完全加载完毕后，执行,放在$(function)()里面就是当页面框架加载完毕后，自动执行 ???????????$(‘:submit‘).click(function () { ???????????????$(‘.error‘).remove(); ???????????????var flag = true; ???????????????$(‘#f1‘).find(‘input[type="text"],input[type="password"]‘).each(function () { ???????????????????var v = $(this).val(); ???????????????????var n = $(this).attr(‘tex‘); ???????????????????if(v.length <= 0){ ???????????????????????flag = false; ???????????????????????var tag = document.createElement(‘span‘); ???????????????????????tag.className = "error"; ???????????????????????tag.innerHTML = n + "必填"; ???????????????????????$(this).after(tag); ???????????????????????// return false; ???????????????????} ???????????????}); ???????????????return flag; ???????}); ???????});// ???????$(‘:submit‘).click(function () {// ???????????var v = $(this).prev().val();// ???????????if(v.length > 0){// ???????????????return true;// ???????????}else{// ???????????????alert(‘请输入内容‘);// ???????????????return false// ???????????}// ???????}) ???</script></body></html>jquery-事件之自动执行
原文地址：http://www.cnblogs.com/lixiang1013/p/7632558.html