日期:2014-05-16  浏览次数:20401 次

javascript事件处理和表单验证

1:DHTML
Dynamic HTML。(HTML/JavaScript/CSS/DOM编程组合成对HTML元素动态的控制。)

DOM:文档对象模型Document Object Model。

2:对应事件
点击事件: onclick(点击) , 双击:ondblclick
焦点: onfocus聚焦  , onblur 失去焦点
鼠标:
onmouseout 移开 , onmouseover 鼠标进入 , onmouseup , onmousemove , onmousedown
键盘: onkeydown , onkeypress , onkeyup
body中: onload , onunload , onerror , onresize
选择事件: onchange
form表单: onsubmit(在提交的时候) , onreset


3:Window对象常见的一些方法和属性
方法
A:消息框 
alert():消息框
confirm():确认框
prompt():输入框

B:弹出页面
open():打开一个页面。
window.open打开的页面,存在子父关系。

showModalDialog():打开一个模态对话框
模态页面注意使用不缓存机制。

showModelessDialog():打开一个非模态对话框

C:定时器
setTimeout()/setInterval()/

clearTimeout()/clearInterval()

使用setTimerOut加递归实现setInterval效果。

D:关闭
close();
使用close时,必须注意。close()方法调用时要寻找其
页面的父对象。


属性
dialogArguments:获取模态对话框与非模态对话框的参数。
opener:获取打开本页面的父窗口
parent:获取父对象
returnValue:获取模态对话框与非模态对话框关闭后的返回值。
status:获取状态栏
top:获取最顶层的对象。


History

back():用在表单提交错误后,返回的历史页面。
forward
go()


Location
href;客户端地址重定向:window.location.href="URL地址"。

reload();重新加载页面。 子窗口刷新父窗口:window.opener.location.reload();

frames:
拿到框架的集合。

<frameset></frameset>
window.parent.名字/window.top.名字



window.frames["框架的名称"]

window.frames[框架的索引下标]

4:表单对象与非表单对象的获取。

表单元素
document.表单的名称.表单元素的名称
<form name="form1">
<input type="text" name="username" value="aa">
document.form1.username.value;
document.form1.username.type;


非表单元素
<table id="testTable">

document.getElementById:获取单个元素。

document.getElementsByName:通过名称来获取元素。返回值是数组。

var usersexArray = document.getElementsByName("usersex");

var boy = usersexArray[0].value;

<input type="radio" name="usersex" value = "1">男

<input type="radio" name="usersex" value = "0">女

document.getElementsByTagName:

<input type="text" name="username" value="aa">
<input type="radio" name="usersex" value = "1">男
<input type="radio" name="usersex" value = "0">女

var tagArray = document.getElementsByTagName("input");

5:表单元素与非表单元素的设值

表单元素
document.表单名称.表单元素名称.value = "新的值";

非表单元素
<td id="testTD">aa/bb</td>

innerHTML:会以HTML语言格式输出内容
innerText:会以文本方式输出内容
document.getElementById("testTD").innerHTML = "新值";



6:窗口之间的传值

A:本页面


B:弹出窗口

Window.open

window.opener:子窗口定位父窗口

window.showmodelDialog

取参数:window.arguments;

返回值:window.returnValue。

C:框架之间