当前位置:首页 » 网站技术 » JavaScript

Javascript实例教程(2)

...

Javascript实例教程(2)

 5.利用Javascript在一个表单中设置和检查Cookies

Cookie 是一小段由浏览器储存起来帮助识别用户身份的信息。在一个表单中设置和检查Cookies的实现需要两个文件来完成。第一个文件为cookie1.html,这个文件需要有一些机理(下面例子的一个按钮)来检查是否有一个Cookie存在,然后再重定向至表单网页或者文档下载网页。而第二个文件,即表单网页(cookie2.html),也是和重要的因为你将要在上面使用一点点JavaScript来设置Cookie,这个设置是在提交表单之前做的。下面给出这文件:

第一个文件(cookie1.html)

<HTML>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!--

function cookieRedirect(hasCookieURL, noCookieURL)

{

var currentCookie = document.cookie;


if (currentCookie.indexOf("formcomplete=yes") != -1) {

window.location = hasCookieURL;

} else {

window.location = noCookieURL;

}

}

// -->

</SCRIPT>

</HEAD>

<BODY>

<FORM NAME="docdownload">

<INPUT TYPE="BUTTON" VALUE="Download document"

onClick="cookieRedirect('doc.html', 'cookie2.html')">

</FORM>

</BODY>

</HTML>

第二个文件(cookie2.html )

<HTML>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!--

function sendForm(objForm)

{

cookieExpires = "Saturday, 01-Jan-03 00:00:00 GMT";

document.cookie = "formcomplete=yes; path=/";

// objForm.submit();

}

// -->

</SCRIPT>

</HEAD>

<BODY>

<FORM ACTION="test.html" NAME="info">

<TABLE>

<TR>

<TD>First name</TD>

<TD><INPUT TYPE="TEXT" NAME="firstname"></TD>

</TR>

<TD>Last name</TD>

<TD><INPUT TYPE="TEXT" NAME="lastname"></TD>

</TR>

<TR>

<TD>Address</TD>

<TD><INPUT TYPE="TEXT" NAME="address"></TD>

</TR>

<TR>

<TD>City</TD>

<TD><INPUT TYPE="TEXT" NAME="city"></TD>

</TR>

<TR>

<TD>State</TD>

<TD><INPUT TYPE="TEXT" NAME="state"></TD>

</TR>

<TR>

<TD>Zip</TD>

<TD><INPUT TYPE="TEXT" NAME="zip"></TD>

</TR>

</TABLE>

<INPUT TYPE="BUTTON" VALUE="Download document"

onClick="sendForm(document.testform)">

</FORM>

</BODY>

</HTML>


下面再给出需要用到的doc.html文件:

doc.html

<HTML>

<BODY>

<H3>This is the document</H3>

</BODY>

</HTML>

为了测试一下这个功能,你可以打开cookie1.html并点击中按钮,你将被带到表单网页。如果你回到cookie1.html文件并点击按钮你就回直接连到文档去。

6.利用Javascript进行密码保护

  随着互联网的飞速发展,地球变得越来越小,人们可以跨越时间和空间得界限进行交流于合作。但是随之也产生了一些肆意搞破坏的黑客,这就使得程序设计人员在编制应用程序中要考虑到黑客袭击这个问题,所以自然而然地就会想到保护。本节教程将教你怎样利用Javascript进行密码保护。利用JavaScript来对网页进行密码保护有几种方法。最早的一种方法是依耐于用户而不知道目标文件名,代码如下:

<SCRIPT LANGUAGE="JavaScript"><!--

function go() {

window.location.href = "http://www.somewhere.com/" +

document.formName.passwordName.value + '.html';

return false;

}

//--></SCRIPT>

在网页中使用这段JavaScript脚本的方法为:

<FORM NAME="formName" onSubmit="return go()">

Enter Password: <INPUT TYPE="password" NAME="passwordName"

VALUE="" SIZE=8>

</FORM>

使用这段JavaScript脚本的一个缺点是用户可以检查源代码并发现文件目录的位置。为了寻求更好的安全措施,你应该通过放置一个缺省的文件(index.html)到JavaScript脚本里面来保护你的文件目录,这样当目录被请求的时候你的服务器总是发送过去。如果你没有包括一个缺省的文件在你的文件目录 ,网络服务器就发送所有包含在你文件目录的所有文件,这正是不安全的隐患。

这里要指出的是,使用JavaScript来对一个文件进行密码保护也不是一个非常安全的方法。为了达到较高的安全系数,这里推荐使用CGI或者服务器函数,比如.htaccess。

7.利用Javascript基于浏览器类型的重定向


基于浏览器类型的重定向的实现可以通过使用JavaScript函数来检查navigator.userAgent的字符串“MSIE”,它将告诉你用户是否使用Microsoft Internet Explorer(微软的IE浏览器)。通过修改windows.location函数可以重定向到正确的URL(同意资源定位器)。下面是详细的代码:

<HTML>

<HEAD>

<SCRIPT LANGUAGE="JavaScript">

<!--

function redirectClient(ieurl, nsurl) {

// test for Internet Explorer (any version)

if (navigator.userAgent.indexOf("MSIE") != -1) {

window.location = ieurl;

} else {

// it's not IE so assume it's Netscape

window.location = nsurl;

}

}

//-->

</SCRIPT>

</HEAD>

<BODY>

Click <A HREF="javascript:redirectClient('explorer.html',

'netscape.html')">here</A>

to redirect based on the user's browser.

</BODY>

</HTML>

8.利用Javascript表单的有效性检验

  表单的有效性检验是JavaScript一个很有用的方面。它可以用于检查一个给定的表单以及发现表单中的任何问题,比如一个空白的输入框或者一个无效的E-mail(电子邮件)地址,然后它可以通知用户并且就不会将这些错误的表单传给服务器以节省时间。另外,除此以外,对表单标签的一些修改跟其它类型的脚本是类似的。以下的例子是一个简单的表单,如下面表单所示。你可以让名字的方框留空白或者输入一个电子邮件地址而没有@符号,即是输入错误的内容,看看JavaScript是进行表单的有效性检验的。


  结果你可以发现如果你忘记输入某一特定类型的数据到表单中去,它就会警告你并且取消提交给服务器。直到你键入了正确的信息,它才将表单发送给服务器。

  下面我们来好好研究一下在Javascript中是如何进行表单的有效性检验的。其中在表单有效性检验中最重要的代码是在表单标签处的一个时间处理器,这个时间处理器(onSubmit)必须返回真值的时候才提交表单。以下是详细的表单代码:

<FORM

NAME = "theform"

ACTION = "mailto:"

METHOD = "POST"

ENCTYPE = "multipart/form-data"

onSubmit="return formCheck()">

当Submit(提交)按钮被按下的时候,这个时间处理器就被触发,它接着执行函数formCheck(),这个函数是用于检查表单中是否没有错误了。

继续阅读
Javascript实例教程(3)
逐隐逐现的文字特效[推荐使用][适用于IE4++]
阴影文字的特殊效果[适用于IE4++][共3种效果]
推拉门式样的菜单[根据提示修改][共2步]
弹出窗口制作详谈!
很有用的网页代码
常用网页特效
Javascript程序之向浏览者问好
JavaScript客户端脚本,绝对值得收藏!
发表评论

昵称:
最新评论
暂时没有评论!