javascript有用小功能总结(未完待续)
1)javascript让页面标题滚动效果
代码如下：
<title>您好，欢迎访问我的博客</title>
<script type="text/javascript">
function scroll() {
//获取title信息。
var titleInfo = document.title;
//获取title第一个字符（数字、字母）。
//注释：字符串中第一个字符的下标是 0。如果参数 index 不在 0 与 string.length 之间，该方法将返回一个空字符串。
var firstInfo = titleInfo.charAt(0);
//获取第二位到最后的信息。
var lastInfo = titleInfo.substring(1, titleInfo.length);
//拼接输出信息
document.title = lastInfo + firstInfo;
}
//使用setInterval()方法，每隔0.5s执行
setInterval("scroll()", 500);
</script>
2)屏蔽鼠标右键(for IE8&IE10，其它IE版本或浏览器有待验证)
<script type="text/javascript">
//屏蔽鼠标右键
document.oncontextmenu = function()
{
event.returnValue = false;
}
</script>
3)回车键执行目标脚本
假如页面中有个LinkButton做的查询按钮(ID为lbtSearch)，回车键实现查询，代码如下：
<script type="text/javascript">
//回车键实现查询
document.onkeydown = function(e)
{
if(!e) e = window.event;//IE中是window.event，Firefox中是e
if((e.keyCode || e.which) == 13)
{
var obj = document.getElementById("lbtSearch");
obj.click();
}
}
</script>
4)屏蔽退格键(BackSpace)，for IE
代码如下：
<script type="text/javascript">
//屏蔽退格键
document.onkeydown = function()
{
if(event.keyCode == 8)
{
if((event.srcElement.tagName.toLowerCase() == "input" || event.srcElement.tagName.toLowerCase() == "textarea") && event.srcElement.isContentEditable == false)
{
event.returnValue = false;
}
}
}
</script>
这里我用的是tagName作元素类型筛选，也可以用type作类型筛选( event.srcElement.type == "text" || event.srcElement.type == "password" || event.srcElement.type == "textarea" )
5)背景自动变色
代码如下：
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title>背景自动变色</title>
<script type="text/javascript">
var Arraycolor = new Array("#00FF66", "#FFFF99", "#99CCFF", "#FFCCFF", "#FFCC99", "#00FFFF", "#FFFF00", "#FFCC00", "#FF00FF");
var n = 0;
function turncolors()
{
n++;
if (n == (Arraycolor.length - 1)) n = 0;
document.bgColor = Arraycolor[n];
setTimeout("turncolors()", 1000);
}
turncolors();
</script>
</head>
<body>
<p>背景自动变色</p>
</body>
</html>
6)简易方法判断浏览器的类型和版本
如何判断浏览器的类型和版本？使用JavaScript的内置对象 navigator 的属性userAgent的值来判断(navigator.userAgent)。
navigator是javascript的内置对象，通常用于检测浏览器与操作系统的版本。 常用的属性有：
- appCodeName -- 浏览器代码名的字符串表示
- appVersion -- 浏览器版本信息的字符串表示
- cookieEnabled -- 如果启用cookie返回true，否则返回false
- javaEnabled -- 如果启用java返回true，否则返回false
- platform -- 浏览器所在计算机平台的字符串表示
- plugins -- 安装在浏览器中的插件数组
- taintEnabled -- 如果启用了数据污点返回true，否则返回false
- userAgent -- 用户代理头的字符串表示（就是包含浏览器版本信息等的字符串）
下面说明一段js正则表达式：
var str = "123123";
var reg = /123/;
alert(reg.test(str));
上述js作用是检测 str 这一个字符串中是否包含123这样的字串。
进入正题，直接上代码(ExtJs使用的就是这种方式判断的)：
<script type="text/javascript">
var ua = navigator.userAgent.toLowerCase();
function check(r)
{
return r.test(ua);
}
/**
* return IE,IE6,IE7,IE8,IE9,Chrome,Firefox,Opera,WebKit,Safari,Others
*/
function getBrowserName()
{
var browserName;
var isOpera = check(/opera/);
var isChrome = check(/chrome/);
var isFirefox = check(/firefox/);
var isWebKit = check(/webkit/);
var isSafari = !isChrome && check(/safari/);
var isIE = !isOpera && check(/msie/);
var isIE7 = isIE && check(/msie 7/);
var isIE8 = isIE && check(/msie 8/);
if(isIE8)
{
browserName = "IE8";
}else if(isIE7)
{
browserName = "IE7";
}else if(isIE)
{
browserName = "IE";
}else if(isChrome)
{
browserName = "Chrome";
}else if(isFirefox)
{
browserName = "Firefox";
}else if(isOpera)
{
browserName = "Opera";
}else if(isWebKit)
{
browserName = "WebKit";
}else if(isSafari)
{
browserName = "Safari";
}else
{
browserName = "Others";
}
return browserName;
}
</script>
简易方法判断浏览器的类型和版本
7)JavaScript调用客户端的可执行文件
<script type="text/javascript">
<!--打开记事本程序-->
function openNotepad()
{
var wsh=new ActiveXObject("wscript.shell")
wsh.run("notepad.exe")//如果在“运行”可以运行就可以在此直接写，否则要写上绝对路径
}
<!--打开计算器程序-->
function openCalc()
{
var wsh=new ActiveXObject("wscript.shell");
wsh.run("calc.exe");
}
<!--打开指定位置文件-->
function openFile(file)
{
var wsh=new ActiveXObject("wscript.shell");
wsh.run(file);
}
</script>
<input type="button" id="notepad" value="Notepad" onclick="openNotepad();" />
<input type="button" id="calc" value="calc" onclick="openCalc();" />
<input type="button" id="file" value="file" onclick="openFile('c://test.txt');" />
8)js页面跳转及刷新(本页面、父页面、最外层页面)
下面为大家分享下不同页面之家的跳转问题，有需要的朋友可以参考下。
"window.location.href"、"location.href"是本页面跳转
"parent.location.href"是上一层页面跳转
"top.location.href"是最外层的页面跳转
举例说明：A,B,C,D都是jsp，D是C的iframe，C是B的iframe，B是A的iframe，如果D中js这样写
"window.location.href"、"location.href"：D页面跳转
"parent.location.href"：C页面跳转
"top.location.href"：A页面跳转
注意：如果D页面中有form的话，则
<form>: form提交后D页面跳转
<form target="_blank">: form提交后弹出新页面
<form target="_parent">: form提交后C页面跳转
<form target="_top"> : form提交后A页面跳转
关于页面刷新，D页面中这样写：
"location.reload();": 本页面刷新
"parent.location.reload();": C页面刷新(当然也可用子窗口的opener对象来获得父窗口的对象：window.opener.document.location.reload();)
"top.location.reload();": A页面刷新
<script type="text/javascript">
// 解决session过期后跳到login页面却跳不出html frameset框架的问题
if (window != top)
{
top.location.href = location.href;
}
</script>
未完待续，慢慢补充...
javascript有用小功能总结(未完待续)的更多相关文章
- Javascript之换肤（未完待续）
这个项目我还没有完全写出来,先记录至此.感觉是方法不对,背景图片的切换方法有Problem.如若有一大神发现了我的文章,还望指导,吾将感激不尽.日后代码还会再钻研再改改. <head> & ...
- linux 维护常见场景小命令 （未完待续）
1.安装KDE桌面 [root@rhel06 ~]# yum -y groupinstall "X Windows System" "KDE Desktop" ...
- 关于DOM的一些总结（未完待续......）
DOM 实例1:购物车实例(数量,小计和总计的变化) 这里主要是如何获取页面元素的节点: document.getElementById("...") cocument.query ...
- 一篇文章让Oracle程序猿学会MySql【未完待续】
一篇文章让Oracle DB学会MySql[未完待续] 随笔前言: 本篇文章是针对已经能够熟练使用Oracle数据库的DB所写的快速学会MySql,为什么敢这么说,是因为本人认为Oracle在功能性方 ...
- 省钱版----查找 IoT 设备TTL线序__未完待续
作者:仙果 原文来自:省钱版—-查找 IoT 设备TTL线序 省钱版----查找 IoT 设备TTL线序__未完待续 缘由 在IoT固件调试分析的过程中,建议首先在IoT设备的板子上焊接调试线,这是能 ...
- Go web编程学习笔记——未完待续
1. 1).GOPATH设置 先设置自己的GOPATH,可以在本机中运行$PATH进行查看: userdeMacBook-Pro:~ user$ $GOPATH -bash: /Users/user/ ...
- Reading | 《数字图像处理原理与实践（MATLAB版）》（未完待续）
目录 一.前言 1.MATLAB or C++ 2.图像文件 文件头 调色板 像素数据 3.RGB颜色空间 原理 坐标表示 4.MATLAB中的图像文件 图像类型 image()函数 imshow() ...
- 构建Linux根文件系统（未完待续）
所谓制作根文件系统, 就是创建各种目录, 并且在里面创建各种文件. 比如在/bin ./sbin 目录下存放各种可执行程序, 在/etc 目录下存放配置文件, 在/lib 目录下存放库文件 ...
- MVC丶 (未完待续······)
希望你看了此小随 可以实现自己的MVC框架 也祝所有的程序员身体健康一切安好 ...
随机推荐
- 如何一步一步用DDD设计一个电商网站（五）—— 停下脚步，重新出发
阅读目录 前言 单元测试 纠正错误,重新出发 结语 一.前言 实际编码已经写了2篇了,在这过程中非常感谢有听到观点不同的声音,借着这个契机,今天这篇就把大家提出的建议一个个的过一遍,重新整理,重新出发 ...
- 记一个mvn奇怪错误： Archive for required library: 'D:/mvn/repos/junit/junit/3.8.1/junit-3.8.1.jar' in project 'xxx' cannot be read or is not a valid ZIP file
我的maven 项目有一个红色感叹号, 而且Problems 存在 errors : Description Resource Path Location Type Archive for requi ...
- ElasticSearch 5学习(10)——结构化查询（包括新特性）
之前我们所有的查询都属于命令行查询,但是不利于复杂的查询,而且一般在项目开发中不使用命令行查询方式,只有在调试测试时使用简单命令行查询,但是,如果想要善用搜索,我们必须使用请求体查询(request ...
- jQuery.Ajax IE8 无效（CORS）
今天在开发的时候,遇到一个问题,$.get()在 IE8 浏览器不起作用,但 Chrome,Firefox 却是可以的,网上资料很多,最后发现是 IE8 默认不支持 CORS 请求,需要手动开启下: ...
- Struts2实现ajax的两种方式
基于Struts2框架下实现Ajax有两种方式,第一种是原声的方式,另外一种是struts2自带的一个插件. js部分调用方式是一样的: JS代码: function testAjax() { var ...
- 【从零开始学BPM，Day2】默认表单开发
[课程主题]主题:5天,一起从零开始学习BPM[课程形式]1.为期5天的短任务学习2.每天观看一个视频,视频学习时间自由安排. [第二天课程] Step 1 软件下载:H3 BPM10.0全开放免费下 ...
- jquery.multiselect 多选下拉框实现
第一步:链接下列文件,如果没有,到此网页下载 https://github.com/ehynds/jquery-ui-multiselect-widget,此插件基于jquery ,所以jquery的 ...
- MongoDB备份(mongodump)和恢复(mongorestore)
MongoDB提供了备份和恢复的功能,分别是MongoDB下载目录下的mongodump.exe和mongorestore.exe文件 1.备份数据使用下面的命令: >mongodump -h ...
- OpenWrt中开启usb存储和samba服务
在从官网安装的WNDR3800 15.05.1版本OpenWrt中, 不带usb存储支持以及samba, 需要另外安装 1. 启用usb支持 USB Basic Support https://wik ...
- 喜马拉雅音频下载器 V1.2 支持专辑批量下载 喜马拉雅mp3下载导出 喜马拉雅下载器
出差一个星期回来看邮箱,发现好多网友评论说网站又更新了,老程序不能用了,有热心网友放出修改版的,我就不重复造车了..大家可以去这里下载 http://blog.csdn.net/suqingheang ...