JS技术

JavaScript学习总结(2)

字号+ 作者:H5之家 来源:H5之家 2015-09-14 11:04 我要评论( )

/^\w+@\w+.\w+$/.test(value); htmlheadtitle/titlescript language="JavaScript"function validate(f){var email = f.name.value;if(/^\w+@\w+.\w+$/.test(email)){return true;}else{return false;}}/scriptform

/^\w+@\w+.\w+$/.test(value);

<html> <head> <title></title> <script language="JavaScript"> function validate(f){ var email = f.name.value; if(/^\w+@\w+.\w+$/.test(email)){ return true; } else{ return false; } } </script> <form action="" method="post" onSubmit="return validate(this)"> EMAIL:<input type="text"/><br /> <input type="submit" value="提交"/> </form> </head> <body > </body> </html>
以上完成了一个简单的验证操作;注意:

观察onSubmit事件,如果需要让返回值有用,需要return;

f.name.focus();可以使文本框获得焦点;

f.name.select();可以选中文本框中的文本;

五、window对象


1.打开新窗口:window.open函数


比如:

window.open("http://www.google.com","width=500,height=500,resizable=no");  打开谷歌网页,并且控制网页大小、尺寸;

window.open("http://www.google.com");普通方法打开网页;

<html> <head> <title></title> <script language="JavaScript"> function fun(url){ window.open(url,"页面标题","width=500,height=500,resizable=no"); } </script> </head> <body > <form action="" method="post"> <select onChange="fun(this.value)"> <option value="#">====请选择====</option> <option value="http://www.baidu.com">百度</option> <option value="http://www.google.com">谷歌</option> </select> </form> </body> </html>

2.确认窗口:window.confirm()


比如:

var flag = window.confirm("确认?"); 如果选是,则返回true;否则返回false;

<html> <head> <title></title> <script language="JavaScript"> function fun(){ if(window.confirm("确认")){ alert("是"); } else{ alert("否"); } } fun(); </script> </head> <body > </body> </html>
3.页面重定向


通过window.location属性能够完成页面的转换;

只需要window.location="http://www.google.com"就能够将当前网页跳转到谷歌;

<html> <head> <title></title> <script language="JavaScript"> function fun(url){ window.location=url; //将当前的网页的地址变换 } </script> </head> <body > <form action="" method="post"> <select onChange="fun(this.value)"> <option value="#">====请选择====</option> <option value="http://www.baidu.com">百度</option> <option value="http://www.google.com">谷歌</option> </select> </form> </body> </html>
4.在子窗口中操作父窗口 opener


通过window.opener.document可以获得父窗口的文档对象;

window.opener.location可以获得父窗口地址;

window.opener.location.reload();重新加载父窗口;

父窗口:

<html> <head> <title></title> <script language="JavaScript"> function fun(){ window.open("demo03.html","页面标题","width=500,height=500,resizable=no"); } </script> </head> <body > <form action="" method="post"> <input type="button" value="打开子窗口"/> </form> </body> </html>
子窗口: <html> <head> <title></title> <script language="JavaScript"> function fun(){ window.opener.location="http://www.baidu.com"; } </script> </head> <body > <input type="button" value="跳转到百度"/> </body> </html>
转自:?viewmode=contents

 

1.本站遵循行业规范,任何转载的稿件都会明确标注作者和来源;2.本站的原创文章,请转载时务必注明文章作者和来源,不尊重原创的行为我们将追究责任;3.作者投稿可能会经我们编辑修改或补充。

相关文章
  • 老生常谈,JavaScript闭包中的this对象

    老生常谈,JavaScript闭包中的this对象

    2016-02-26 10:21

  • 学习JavaScript之this,call,apply

    学习JavaScript之this,call,apply

    2016-01-28 20:45

  • JavaScript复习笔记--字符串

    JavaScript复习笔记--字符串

    2016-01-27 17:16

  • WEB前端教程-JavaScript里的类和继承

    WEB前端教程-JavaScript里的类和继承

    2016-01-21 15:28

网友点评
/