`

实用功能和经典的javaScript代码

阅读更多

一、验证类
1、数字验证内
1.1 整数
/^(-|\+)?\d+$/.test(str)
1.2 大于0的整数 (用于传来的ID的验证)
/^\d+$/.test(str)
1.3 负整数的验证
/^-\d+$/.test(str)
2、时间类
2.1 短时间,形如 (13:04:06)
function isTime(str)
{
var a = str.match(/^(\d{1,2})(:)?(\d{1,2})\2(\d{1,2})$/);
if (a == null) {alert('输入的参数不是时间格式'); return false;}
if (a[1]>24 || a[3]>60 || a[4]>60)
{
alert("时间格式不对");
return false
}
return true;
}
2.2 短日期,形如 (2003-12-05)
function strDateTime(str)
{
var r = str.match(/^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2})$/);
if(r==null)return false;
var d= new Date(r[1], r[3]-1, r[4]);
return (d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]);
}
2.3 长时间,形如 (2003-12-05 13:04:06)
function strDateTime(str)
{
var reg = /^(\d{1,4})(-|\/)(\d{1,2})\2(\d{1,2}) (\d{1,2}):(\d{1,2}):(\d{1,2})$/;
var r = str.match(reg);
if(r==null)return false;
var d= new Date(r[1], r[3]-1,r[4],r[5],r[6],r[7]);
return (d.getFullYear()==r[1]&&(d.getMonth()+1)==r[3]&&d.getDate()==r[4]&&d.getHours()==r[5]&&d.getMinutes()==r[6]&&d.getSeconds()==r[7]);
}
2.4 只有年和月。形如(2003-05,或者2003-5)
2.5 只有小时和分钟,形如(12:03)
3、表单类
3.1 所有的表单的值都不能为空
<input onblur="if(this.value.replace(/^\s+|\s+$/g,'')=='')alert('不能为空!')">
3.2 多行文本框的值不能为空。
3.3 多行文本框的值不能超过sMaxStrleng
3.4 多行文本框的值不能少于sMixStrleng
3.5 判断单选框是否选择。
3.6 判断复选框是否选择.
3.7 复选框的全选,多选,全不选,反选
3.8 文件上传过程中判断文件类型
4、字符类
4.1 判断字符全部由a-Z或者是A-Z的字字母组成
<input onblur="if(/[^a-zA-Z]/g.test(this.value))alert('有错')">
4.2 判断字符由字母和数字组成。
<input onblur="if(/[^0-9a-zA-Z]/g.test(this.value))alert('有错')">
4.3 判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母
/^([a-zA-z_]{1})([\w]*)$/g.test(str)
4.4 字符串替换函数.Replace();
5、浏览器类
5.1 判断浏览器的类型
window.navigator.appName
5.2 判断ie的版本
window.navigator.appVersion
5.3 判断客户端的分辨率
window.screen.height; window.screen.width;

6、结合类
6.1 email的判断。
function ismail(mail)
{
return(new RegExp(/^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-9]+((\.|-)[A-Za-z0-9]+)*\.[A-Za-z0-9]+$/).test(mail));
}
6.2 手机号码的验证
6.3 身份证的验证
function isIdCardNo(num)
{
if (isNaN(num)) {alert("输入的不是数字!"); return false;}
var len = num.length, re;
if (len == 15)
re = new RegExp(/^(\d{6})()?(\d{2})(\d{2})(\d{2})(\d{3})$/);
else if (len == 18)
re = new RegExp(/^(\d{6})()?(\d{4})(\d{2})(\d{2})(\d{3})(\d)$/);
else {alert("输入的数字位数不对!"); return false;}
var a = num.match(re);
if (a != null)
{
if (len==15)
{
var D = new Date("19"+a[3]+"/"+a[4]+"/"+a[5]);
var B = D.getYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
else
{
var D = new Date(a[3]+"/"+a[4]+"/"+a[5]);
var B = D.getFullYear()==a[3]&&(D.getMonth()+1)==a[4]&&D.getDate()==a[5];
}
if (!B) {alert("输入的身份证号 "+ a[0] +" 里出生日期不对!"); return false;}
}
return true;
}

画图:
<OBJECT
id=S
style="LEFT: 0px; WIDTH: 392px; TOP: 0px; HEIGHT: 240px"
height=240
width=392
classid="clsid:369303C2-D7AC-11D0-89D5-00A0C90833E6">
</OBJECT>
<SCRIPT>
S.DrawingSurface.ArcDegrees(0,0,0,30,50,60);
S.DrawingSurface.ArcRadians(30,0,0,30,50,60);
S.DrawingSurface.Line(10,10,100,100);
</SCRIPT>

写注册表:
<SCRIPT>
var WshShell = WScript.CreateObject("WScript.Shell");
WshShell.RegWrite ("HKCU\\Software\\ACME\\FortuneTeller\\", 1, "REG_BINARY");
WshShell.RegWrite ("HKCU\\Software\\ACME\\FortuneTeller\\MindReader", "Goocher!", "REG_SZ");
var bKey = WshShell.RegRead ("HKCU\\Software\\ACME\\FortuneTeller\\");
WScript.Echo (WshShell.RegRead ("HKCU\\Software\\ACME\\FortuneTeller\\MindReader"));
WshShell.RegDelete ("HKCU\\Software\\ACME\\FortuneTeller\\MindReader");
WshShell.RegDelete ("HKCU\\Software\\ACME\\FortuneTeller\\");
WshShell.RegDelete ("HKCU\\Software\\ACME\\");
</SCRIPT>

TABLAE相关(客户端动态增加行列)
<HTML>
<SCRIPT LANGUAGE="JScript">
function numberCells() {
var count=0;
for (i=0; i < document.all.mytable.rows.length; i++) {
for (j=0; j < document.all.mytable.rows(i).cells.length; j++) {
document.all.mytable.rows(i).cells(j).innerText = count;
count++;
}
}
}
</SCRIPT>
<BODY onload="numberCells()">
<TABLE id=mytable border=1>
<TR><TH>&nbsp;</TH><TH>&nbsp;</TH><TH>&nbsp;</TH><TH>&nbsp;</TH></TR>
<TR><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD></TR>
<TR><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD><TD>&nbsp;</TD></TR>
</TABLE>
</BODY>
</HTML>

1.身份证严格验证:

<script>
var aCity={11:"北京",12:"天津",13:"河北",14:"山西",15:"内蒙古",21:"辽宁",22:"吉林",23:"黑龙江",31:"上海",32:"江苏",33:"浙江",34:"安徽",35:"福建",36:"江西",37:"山东",41:"河南",42:"湖北",43:"湖南",44:"广东",45:"广西",46:"海南",50:"重庆",51:"四川",52:"贵州",53:"云南",54:"西藏",61:"陕西",62:"甘肃",63:"青海",64:"宁夏",65:"新疆",71:"台湾",81:"香港",82:"澳门",91:"国外"}

function cidInfo(sId){
var iSum=0
var info=""
if(!/^\d{17}(\d|x)$/i.test(sId))return false;
sId=sId.replace(/x$/i,"a");
if(aCity[parseInt(sId.substr(0,2))]==null)return "Error:非法地区";
sBirthday=sId.substr(6,4)+"-"+Number(sId.substr(10,2))+"-"+Number(sId.substr(12,2));
var d=new Date(sBirthday.replace(/-/g,"/"))
if(sBirthday!=(d.getFullYear()+"-"+ (d.getMonth()+1) + "-" + d.getDate()))return "Error:非法生日";
for(var i = 17;i>=0;i --) iSum += (Math.pow(2,i) % 11) * parseInt(sId.charAt(17 - i),11)
if(iSum%11!=1)return "Error:非法证号";
return aCity[parseInt(sId.substr(0,2))]+","+sBirthday+","+(sId.substr(16,1)%2?"男":"女")
}

document.write(cidInfo("380524198002300016"),"<br/>");
document.write(cidInfo("340524198002300019"),"<br/>")
document.write(cidInfo("340524197711111111"),"<br/>")
document.write(cidInfo("34052419800101001x"),"<br/>");
</script>

2.验证IP地址
<SCRIPT LANGUAGE="JavaScript">
function isip(s){
var check=function(v){try{return (v<=255 && v>=0)}catch(x){return false}};
var re=s.split(".")
return (re.length==4)?(check(re[0]) && check(re[1]) && check(re[2]) && check(re[3])):false
}

var s="202.197.78.129";
alert(isip(s))
</SCRIPT>

3.加sp1后还能用的无边框窗口!!
<HTML XMLNS:IE>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<IE:Download ID="include" STYLE="behavior:url(#default#download)" />
<title>Chromeless Window</title>

<SCRIPT LANGUAGE="JScript">
/*--- Special Thanks For andot ---*/

/*
This following code are designed and writen by Windy_sk <seasonx@163.net>
You can use it freely, but u must held all the copyright items!
*/

/*--- Thanks For andot Again ---*/

var CW_width = 400;
var CW_height = 300;
var CW_top = 100;
var CW_left = 100;
var CW_url = "/";
var New_CW = window.createPopup();
var CW_Body = New_CW.document.body;
var content = "";
var CSStext = "margin:1px;color:black; border:2px outset;border-style:expression(onmouseout=onmouseup=function(){this.style.borderStyle='outset'}, onmousedown=function(){if(event.button!=2)this.style.borderStyle='inset'});background-color:buttonface;width:16px;height:14px;font-size:12px;line-height:11px;cursor:Default;";

//Build Window
include.startDownload(CW_url, function(source){content=source});

function insert_content(){
var temp = "";
CW_Body.style.overflow = "hidden";
CW_Body.style.backgroundColor = "white";
CW_Body.style.border = "solid black 1px";
content = content.replace(/<a ([^>]*)>/g,"<a onclick='parent.open(this.href);return false' $1>");
temp += "<table width=100% height=100% cellpadding=0 cellspacing=0 border=0>";
temp += "<tr style=';font-size:12px;background:#0099CC;height:20;cursor:default' ondblclick=\"Max.innerText=Max.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();\" onmouseup='parent.drag_up(event)' onmousemove='parent.drag_move(event)' onmousedown='parent.drag_down(event)' onselectstart='return false' oncontextmenu='return false'>";
temp += "<td style='color:#ffffff;padding-left:5px'>Chromeless Window For IE6 SP1</td>";
temp += "<td style='color:#ffffff;padding-right:5px;' align=right>";
temp += "<span id=Help onclick=\"alert('Chromeless Window For IE6 SP1 - Ver 1.0\\n\\nCode By Windy_sk\\n\\nSpecial Thanks For andot')\" style=\""+CSStext+"font-family:System;padding-right:2px;\">?</span>";
temp += "<span id=Min onclick='parent.New_CW.hide();parent.blur()' style=\""+CSStext+"font-family:Webdings;\" title='Minimum'>0</span>";
temp += "<span id=Max onclick=\"this.innerText=this.innerText=='1'?'2':'1';parent.if_max=!parent.if_max;parent.show_CW();\" style=\""+CSStext+"font-family:Webdings;\" title='Maximum'>1</span>";
temp += "<span id=Close onclick='parent.opener=null;parent.close()' style=\""+CSStext+"font-family:System;padding-right:2px;\" title='Close'>x</span>";
temp += "</td></tr><tr><td colspan=2>";
temp += "<div id=include style='overflow:scroll;overflow-x:hidden;overflow-y:auto; HEIGHT: 100%; width:"+CW_width+"'>";
temp += content;
temp += "</div>";
temp += "</td></tr></table>";
CW_Body.innerHTML = temp;
}

setTimeout("insert_content()",1000);

var if_max = true;
function show_CW(){
window.moveTo(10000, 10000);
if(if_max){
New_CW.show(CW_top, CW_left, CW_width, CW_height);
if(typeof(New_CW.document.all.include)!="undefined"){
New_CW.document.all.include.style.width = CW_width;
New_CW.document.all.Max.innerText = "1";
}

}else{
New_CW.show(0, 0, screen.width, screen.height);
New_CW.document.all.include.style.width = screen.width;
}
}

window.onfocus = show_CW;
window.onresize = show_CW;

// Move Window
var drag_x,drag_y,draging=false

function drag_move(e){
if (draging){
New_CW.show(e.screenX-drag_x, e.screenY-drag_y, CW_width, CW_height);
return false;
}
}

function drag_down(e){
if(e.button==2)return;
if(New_CW.document.body.offsetWidth==screen.width && New_CW.document.body.offsetHeight==screen.height)return;
drag_x=e.clientX;
drag_y=e.clientY;
draging=true;
e.srcElement.setCapture();
}

function drag_up(e){
draging=false;
e.srcElement.releaseCapture();
if(New_CW.document.body.offsetWidth==screen.width && New_CW.document.body.offsetHeight==screen.height) return;
CW_top = e.screenX-drag_x;
CW_left = e.screenY-drag_y;
}

</SCRIPT>
</HTML>

贴两个关于treeview的
<script language="javascript">
<!--
//初始化选中节点
function initchecknode()
{
var node=TreeView1.getTreeNode("1");
node.setAttribute("Checked","true");
setcheck(node,"true");
FindCheckedFromNode(TreeView1);
}
//oncheck事件
function tree_oncheck(tree)
{
var node=tree.getTreeNode(tree.clickedNodeIndex);
var Pchecked=tree.getTreeNode(tree.clickedNodeIndex).getAttribute("checked");
setcheck(node,Pchecked);
document.all.checked.value="";
document.all.unchecked.value="";
FindCheckedFromNode(TreeView1);
}
//设置子节点选中
function setcheck(node,Pc)
{
var i;
var ChildNode=new Array();
ChildNode=node.getChildren();

if(parseInt(ChildNode.length)==0)
return;
else
{
for(i=0;i<ChildNode.length;i++)
{
var cNode;
cNode=ChildNode[i];
if(parseInt(cNode.getChildren().length)!=0)
setcheck(cNode,Pc);
cNode.setAttribute("Checked",Pc);
}
}
}
//获取所有节点状态
function FindCheckedFromNode(node) {
var i = 0;
var nodes = new Array();
nodes = node.getChildren();

for (i = 0; i < nodes.length; i++) {
var cNode;
cNode=nodes[i];
if (cNode.getAttribute("Checked"))
AddChecked(cNode);
else
AddUnChecked(cNode);

if (parseInt(cNode.getChildren().length) != 0 ) {
FindCheckedFromNode(cNode);
}
}
}
//添加选中节点
function AddChecked(node) {
document.all.checked.value += node.getAttribute("NodeData");
document.all.checked.value += ',';
}
//添加未选中节点
function AddUnChecked(node) {
document.all.unchecked.value += node.getAttribute("NodeData");
document.all.unchecked.value += ',';
}
//-->
</script>


treeview中如何在服务器端得到客户端设置后的节点选中状态
<script language="C#" runat="server">
private void Button1_Click(object sender, System.EventArgs e)
{
Response.Write(TreeView1.Nodes[0].Checked);
}
</script>
<script language="javascript">
function set_check()
{
var nodeindex = "0";
var node=TreeView1.getTreeNode(nodeindex);
node.setAttribute("Checked","True");
TreeView1.queueEvent('oncheck', nodeindex);
}
</script>


http://www.baron.com.cn/javascript/time/20021106time1.htm
非常实用的日期选择代码


三個實用的小技巧:關閉輸入法.禁止貼上.禁止複製
關閉輸入法

本文字框輸入法被關閉:
語法: style="ime-mode:disabled"
範例: <input type="text" name="textfield" style="ime-mode:disabled">

禁止貼上

本文字框禁止貼上文字:
語法:onpaste="return false"
範例:<input type="text" name="textfield" onpaste="return false">

禁止複製

本文字框禁止複製:
語法:oncopy="return false;" oncut="return false;"
範例:<input name="textfield" type="text" value="不能複製裡面的字" oncopy="return false;" oncut="return false;">


http://www.imgshow.com/blog/showlog.asp?log_id=634&cat_id=35
页面嵌入式流媒体点唱机

http://www.ddvip.net/web/javascript/jq/55.htm

一个很酷的程序JavaScript做的MID歌曲搜索播放器[IE](JS)
比较简单!

http://fason.nease.net
http://blog.csdn.net/rickjelly2004/category/19937.aspx
http://blog.csdn.net/rickjelly2004/category/19922.aspx


//================================
//Cookie操作
//================================
function getCookieVal (offset)
{
var endstr = document.cookie.indexOf (";", offset);
if (endstr == -1)
endstr = document.cookie.length;
return unescape(document.cookie.substring(offset, endstr));
}

function GetCookie (name)
{
var arg = name + "=";
var alen = arg.length;
var clen = document.cookie.length;
var i = 0;
while (i < clen)
{
var j = i + alen;
if (document.cookie.substring(i, j) == arg)
return getCookieVal (j);
i = document.cookie.indexOf(" ", i) + 1;
if (i == 0)
break;
}
return null;
}


function deleteCookie(cname) {

var expdate = new Date();
expdate.setTime(expdate.getTime() - (24 * 60 * 60 * 1000 * 369));

// document.cookie =" ckValue="ok"; expires="+ expdate.toGMTString();
setCookie(cname,"",expdate);

}

function setCookie (name, value, expires) {

document.cookie = name + "=" + escape(value) +
"; expires=" + expires.toGMTString() ;
}


[点击此处收藏本文]
发表于 2004年10月28日 9:27 AM


goody9807 发表于2004-10-28 9:40 AM
一个可以在页面上随意画线、多边形、圆,填充等功能的js (part 1)

var jg_ihtm, jg_ie, jg_fast, jg_dom, jg_moz,
jg_n4 = (document.layers && typeof document.classes != "undefined");


function chkDHTM(x, i)
{
x = document.body || null;
jg_ie = x && typeof x.insertAdjacentHTML != "undefined";
jg_dom = (x && !jg_ie &&
typeof x.appendChild != "undefined" &&
typeof document.createRange != "undefined" &&
typeof (i = document.createRange()).setStartBefore != "undefined" &&
typeof i.createContextualFragment != "undefined");
jg_ihtm = !jg_ie && !jg_dom && x && typeof x.innerHTML != "undefined";
jg_fast = jg_ie && document.all && !window.opera;
jg_moz = jg_dom && typeof x.style.MozOpacity != "undefined";
}


function pntDoc()
{
this.wnd.document.write(jg_fast? this.htmRpc() : this.htm);
this.htm = '';
}


function pntCnvDom()
{
var x = document.createRange();
x.setStartBefore(this.cnv);
x = x.createContextualFragment(jg_fast? this.htmRpc() : this.htm);
this.cnv.appendChild(x);
this.htm = '';
}


function pntCnvIe()
{
this.cnv.insertAdjacentHTML("BeforeEnd", jg_fast? this.htmRpc() : this.htm);
this.htm = '';
}


function pntCnvIhtm()
{
this.cnv.innerHTML += this.htm;
this.htm = '';
}


function pntCnv()
{
this.htm = '';
}


function mkDiv(x, y, w, h)
{
this.htm += '<div style="position:absolute;'+
'left:' + x + 'px;'+
'top:' + y + 'px;'+
'width:' + w + 'px;'+
'height:' + h + 'px;'+
'clip:rect(0,'+w+'px,'+h+'px,0);'+
'background-color:' + this.color +
(!jg_moz? ';overflow:hidden' : '')+
';"><\/div>';
}


function mkDivIe(x, y, w, h)
{
this.htm += '%%'+this.color+';'+x+';'+y+';'+w+';'+h+';';
}


function mkDivPrt(x, y, w, h)
{
this.htm += '<div style="position:absolute;'+
'border-left:' + w + 'px solid ' + this.color + ';'+
'left:' + x + 'px;'+
'top:' + y + 'px;'+
'width:0px;'+
'height:' + h + 'px;'+
'clip:rect(0,'+w+'px,'+h+'px,0);'+
'background-color:' + this.color +
(!jg_moz? ';overflow:hidden' : '')+
';"><\/div>';
}


function mkLyr(x, y, w, h)
{
this.htm += '<layer '+
'left="' + x + '" '+
'top="' + y + '" '+
'width="' + w + '" '+
'height="' + h + '" '+
'bgcolor="' + this.color + '"><\/layer>\n';
}


var regex = /%%([^;]+);([^;]+);([^;]+);([^;]+);([^;]+);/g;
function htmRpc()
{
return this.htm.replace(
regex,
'<div style="overflow:hidden;position:absolute;background-color:'+
'$1;left:$2;top:$3;width:$4;height:$5"></div>\n');
}


function htmPrtRpc()
{
return this.htm.replace(
regex,
'<div style="overflow:hidden;position:absolute;background-color:'+
'$1;left:$2;top:$3;width:$4;height:$5;border-left:$4px solid $1"></div>\n');
}


function mkLin(x1, y1, x2, y2)
{
if (x1 > x2)
{
var _x2 = x2;
var _y2 = y2;
x2 = x1;
y2 = y1;
x1 = _x2;
y1 = _y2;
}
var dx = x2-x1, dy = Math.abs(y2-y1),
x = x1, y = y1,
yIncr = (y1 > y2)? -1 : 1;

if (dx >= dy)
{
var pr = dy<<1,
pru = pr - (dx<<1),
p = pr-dx,
ox = x;
while ((dx--) > 0)
{
++x;
if (p > 0)
{
this.mkDiv(ox, y, x-ox, 1);
y += yIncr;
p += pru;
ox = x;
}
else p += pr;
}
this.mkDiv(ox, y, x2-ox+1, 1);
}

else
{
var pr = dx<<1,
pru = pr - (dy<<1),
p = pr-dy,
oy = y;
if (y2 <= y1)
{
while ((dy--) > 0)
{
if (p > 0)
{
this.mkDiv(x++, y, 1, oy-y+1);
y += yIncr;
p += pru;
oy = y;
}
else
{
y += yIncr;
p += pr;
}
}
this.mkDiv(x2, y2, 1, oy-y2+1);
}
else
{
while ((dy--) > 0)
{
y += yIncr;
if (p > 0)
{
this.mkDiv(x++, oy, 1, y-oy);
p += pru;
oy = y;
}
else p += pr;
}
this.mkDiv(x2, oy, 1, y2-oy+1);
}
}
}


function mkLin2D(x1, y1, x2, y2)
{
if (x1 > x2)
{
var _x2 = x2;
var _y2 = y2;
x2 = x1;
y2 = y1;
x1 = _x2;
y1 = _y2;
}
var dx = x2-x1, dy = Math.abs(y2-y1),
x = x1, y = y1,
yIncr = (y1 > y2)? -1 : 1;

var s = this.stroke;
if (dx >= dy)
{
if (s-3 > 0)
{
var _s = (s*dx*Math.sqrt(1+dy*dy/(dx*dx))-dx-(s>>1)*dy) / dx;
_s = (!(s-4)? Math.ceil(_s) : Math.round(_s)) + 1;
}
else var _s = s;
var ad = Math.ceil(s/2);

var pr = dy<<1,
pru = pr - (dx<<1),
p = pr-dx,
ox = x;
while ((dx--) > 0)
{
++x;
if (p > 0)
{
this.mkDiv(ox, y, x-ox+ad, _s);
y += yIncr;
p += pru;
ox = x;
}
else p += pr;
}
this.mkDiv(ox, y, x2-ox+ad+1, _s);
}

else
{
if (s-3 > 0)
{
var _s = (s*dy*Math.sqrt(1+dx*dx/(dy*dy))-(s>>1)*dx-dy) / dy;
_s = (!(s-4)? Math.ceil(_s) : Math.round(_s)) + 1;
}
else var _s = s;
var ad = Math.round(s/2);

var pr = dx<<1,
pru = pr - (dy<<1),
p = pr-dy,
oy = y;
if (y2 <= y1)
{
++ad;
while ((dy--) > 0)
{
if (p > 0)
{
this.mkDiv(x++, y, _s, oy-y+ad);
y += yIncr;
p += pru;
oy = y;
}
else
{
y += yIncr;
p += pr;
}
}
this.mkDiv(x2, y2, _s, oy-y2+ad);
}
else
{
while ((dy--) > 0)
{
y += yIncr;
if (p > 0)
{
this.mkDiv(x++, oy, _s, y-oy+ad);
p += pru;
oy = y;
}
else p += pr;
}
this.mkDiv(x2, oy, _s, y2-oy+ad+1);
}
}
}


function mkLinDott(x1, y1, x2, y2)
{
if (x1 > x2)
{
var _x2 = x2;
var _y2 = y2;
x2 = x1;
y2 = y1;
x1 = _x2;
y1 = _y2;
}
var dx = x2-x1, dy = Math.abs(y2-y1),
x = x1, y = y1,
yIncr = (y1 > y2)? -1 : 1,
drw = true;
if (dx >= dy)
{
var pr = dy<<1,
pru = pr - (dx<<1),
p = pr-dx;
while ((dx--) > 0)
{
if (drw) this.mkDiv(x, y, 1, 1);
drw = !drw;
if (p > 0)
{
y += yIncr;
p += pru;
}
else p += pr;
++x;
}
if (drw) this.mkDiv(x, y, 1, 1);
}

else
{
var pr = dx<<1,
pru = pr - (dy<<1),
p = pr-dy;
while ((dy--) > 0)
{
if (drw) this.mkDiv(x, y, 1, 1);
drw = !drw;
y += yIncr;
if (p > 0)
{
++x;
p += pru;
}
else p += pr;
}
if (drw) this.mkDiv(x, y, 1, 1);
}
}


function mkOv(left, top, width, height)
{
var a = width>>1, b = height>>1,
wod = width&1, hod = (height&1)+1,
cx = left+a, cy = top+b,
x = 0, y = b,
ox = 0, oy = b,
aa = (a*a)<<1, bb = (b*b)<<1,
st = (aa>>1)*(1-(b<<1)) + bb,
tt = (bb>>1) - aa*((b<<1)-1),
w, h;
while (y > 0)
{
if (st < 0)
{
st += bb*((x<<1)+3);
tt += (bb<<1)*(++x);
}
else if (tt < 0)
{
st += bb*((x<<1)+3) - (aa<<1)*(y-1);
tt += (bb<<1)*(++x) - aa*(((y--)<<1)-3);
w = x-ox;
h = oy-y;
if (w&2 && h&2)
{
this.mkOvQds(cx, cy, -x+2, ox+wod, -oy, oy-1+hod, 1, 1);
this.mkOvQds(cx, cy, -x+1, x-1+wod, -y-1, y+hod, 1, 1);
}
else this.mkOvQds(cx, cy, -x+1, ox+wod, -oy, oy-h+hod, w, h);
ox = x;
oy = y;
}
else
{
tt -= aa*((y<<1)-3);
st -= (aa<<1)*(--y);
}
}
this.mkDiv(cx-a, cy-oy, a-ox+1, (oy<<1)+hod);
this.mkDiv(cx+ox+wod, cy-oy, a-ox+1, (oy<<1)+hod);
}


一个可以在页面上随意画线、多边形、圆,填充等功能的js (part 2)


function mkOv2D(left, top, width, height)
{
var s = this.stroke;
width += s-1;
height += s-1;
var a = width>>1, b = height>>1,
wod = width&1, hod = (height&1)+1,
cx = left+a, cy = top+b,
x = 0, y = b,
aa = (a*a)<<1, bb = (b*b)<<1,
st = (aa>>1)*(1-(b<<1)) + bb,
tt = (bb>>1) - aa*((b<<1)-1);

if (s-4 < 0 && (!(s-2) || width-51 > 0 && height-51 > 0))
{
var ox = 0, oy = b,
w, h,
pxl, pxr, pxt, pxb, pxw;
while (y > 0)
{
if (st < 0)
{
st += bb*((x<<1)+3);
tt += (bb<<1)*(++x);
}
else if (tt < 0)
{
st += bb*((x<<1)+3) - (aa<<1)*(y-1);
tt += (bb<<1)*(++x) - aa*(((y--)<<1)-3);
w = x-ox;
h = oy-y;

if (w-1)
{
pxw = w+1+(s&1);
h = s;
}
else if (h-1)
{
pxw = s;
h += 1+(s&1);
}
else pxw = h = s;
this.mkOvQds(cx, cy, -x+1, ox-pxw+w+wod, -oy, -h+oy+hod, pxw, h);
ox = x;
oy = y;
}
else
{
tt -= aa*((y<<1)-3);
st -= (aa<<1)*(--y);
}
}
this.mkDiv(cx-a, cy-oy, s, (oy<<1)+hod);
this.mkDiv(cx+a+wod-s+1, cy-oy, s, (oy<<1)+hod);
}

else
{
var _a = (width-((s-1)<<1))>>1,
_b = (height-((s-1)<<1))>>1,
_x = 0, _y = _b,
_aa = (_a*_a)<<1, _bb = (_b*_b)<<1,
_st = (_aa>>1)*(1-(_b<<1)) + _bb,
_tt = (_bb>>1) - _aa*((_b<<1)-1),

pxl = new Array(),
pxt = new Array(),
_pxb = new Array();
pxl[0] = 0;
pxt[0] = b;
_pxb[0] = _b-1;
while (y > 0)
{
if (st < 0)
{
st += bb*((x<<1)+3);
tt += (bb<<1)*(++x);
pxl[pxl.length] = x;
pxt[pxt.length] = y;
}
else if (tt < 0)
{
st += bb*((x<<1)+3) - (aa<<1)*(y-1);
tt += (bb<<1)*(++x) - aa*(((y--)<<1)-3);
pxl[pxl.length] = x;
pxt[pxt.length] = y;
}
else
{
tt -= aa*((y<<1)-3);
st -= (aa<<1)*(--y);
}

if (_y > 0)
{
if (_st < 0)
{
_st += _bb*((_x<<1)+3);
_tt += (_bb<<1)*(++_x);
_pxb[_pxb.length] = _y-1;
}
else if (_tt < 0)
{
_st += _bb*((_x<<1)+3) - (_aa<<1)*(_y-1);
_tt += (_bb<<1)*(++_x) - _aa*(((_y--)<<1)-3);
_pxb[_pxb.length] = _y-1;
}
else
{
_tt -= _aa*((_y<<1)-3);
_st -= (_aa<<1)*(--_y);
_pxb[_pxb.length-1]--;
}
}
}

var ox = 0, oy = b,
_oy = _pxb[0],
l = pxl.length,
w, h;
for (var i = 0; i < l; i++)
{
if (typeof _pxb[i] != "undefined")
{
if (_pxb[i] < _oy || pxt[i] < oy)
{
x = pxl[i];
this.mkOvQds(cx, cy, -x+1, ox+wod, -oy, _oy+hod, x-ox, oy-_oy);
ox = x;
oy = pxt[i];
_oy = _pxb[i];
}
}
else
{
x = pxl[i];
this.mkDiv(cx-x+1, cy-oy, 1, (oy<<1)+hod);
this.mkDiv(cx+ox+wod, cy-oy, 1, (oy<<1)+hod);
ox = x;
oy = pxt[i];
}
}
this.mkDiv(cx-a, cy-oy, 1, (oy<<1)+hod);
this.mkDiv(cx+ox+wod, cy-oy, 1, (oy<<1)+hod);
}
}


function mkOvDott(left, top, width, height)
{
var a = width>>1, b = height>>1,
wod = width&1, hod = height&1,
cx = left+a, cy = top+b,
x = 0, y = b,
aa2 = (a*a)<<1, aa4 = aa2<<1, bb = (b*b)<<1,
st = (aa2>>1)*(1-(b<<1)) + bb,
tt = (bb>>1) - aa2*((b<<1)-1),
drw = true;
while (y > 0)
{
if (st < 0)
{
st += bb*((x<<1)+3);
tt += (bb<<1)*(++x);
}
else if (tt < 0)
{
st += bb*((x<<1)+3) - aa4*(y-1);
tt += (bb<<1)*(++x) - aa2*(((y--)<<1)-3);
}
else
{
tt -= aa2*((y<<1)-3);
st -= aa4*(--y);
}
if (drw) this.mkOvQds(cx, cy, -x, x+wod, -y, y+hod, 1, 1);
drw = !drw;
}
}


一个可以在页面上随意画线、多边形、圆,填充等功能的js (part 3)

function mkRect(x, y, w, h)
{
var s = this.stroke;
this.mkDiv(x, y, w, s);
this.mkDiv(x+w, y, s, h);
this.mkDiv(x, y+h, w+s, s);
this.mkDiv(x, y+s, s, h-s);
}


function mkRectDott(x, y, w, h)
{
this.drawLine(x, y, x+w, y);
this.drawLine(x+w, y, x+w, y+h);
this.drawLine(x, y+h, x+w, y+h);
this.drawLine(x, y, x, y+h);
}


function jsgFont()
{
this.PLAIN = 'font-weight:normal;';
this.BOLD = 'font-weight:bold;';
this.ITALIC = 'font-style:italic;';
this.ITALIC_BOLD = this.ITALIC + this.BOLD;
this.BOLD_ITALIC = this.ITALIC_BOLD;
}
var Font = new jsgFont();


function jsgStroke()
{
this.DOTTED = -1;
}
var Stroke = new jsgStroke();


function jsGraphics(id, wnd)
{
this.setColor = new Function('arg', 'this.color = arg.toLowerCase();');

this.setStroke = function(x)
{
this.stroke = x;
if (!(x+1))
{
this.drawLine = mkLinDott;
this.mkOv = mkOvDott;
this.drawRect = mkRectDott;
}
else if (x-1 > 0)
{
this.drawLine = mkLin2D;
this.mkOv = mkOv2D;
this.drawRect = mkRect;
}
else
{
this.drawLine = mkLin;
this.mkOv = mkOv;
this.drawRect = mkRect;
}
};


this.setPrintable = function(arg)
{
this.printable = arg;
if (jg_fast)
{
this.mkDiv = mkDivIe;
this.htmRpc = arg? htmPrtRpc : htmRpc;
}
else this.mkDiv = jg_n4? mkLyr : arg? mkDivPrt : mkDiv;
};


this.setFont = function(fam, sz, sty)
{
this.ftFam = fam;
this.ftSz = sz;
this.ftSty = sty || Font.PLAIN;
};


this.drawPolyline = this.drawPolyLine = function(x, y, s)
{
for (var i=0 ; i<x.length-1 ; i++ )
this.drawLine(x[i], y[i], x[i+1], y[i+1]);
};


this.fillRect = function(x, y, w, h)
{
this.mkDiv(x, y, w, h);
};


this.drawPolygon = function(x, y)
{
this.drawPolyline(x, y);
this.drawLine(x[x.length-1], y[x.length-1], x[0], y[0]);
};


this.drawEllipse = this.drawOval = function(x, y, w, h)
{
this.mkOv(x, y, w, h);
};


this.fillEllipse = this.fillOval = function(left, top, w, h)
{
var a = (w -= 1)>>1, b = (h -= 1)>>1,
wod = (w&1)+1, hod = (h&1)+1,
cx = left+a, cy = top+b,
x = 0, y = b,
ox = 0, oy = b,
aa2 = (a*a)<<1, aa4 = aa2<<1, bb = (b*b)<<1,
st = (aa2>>1)*(1-(b<<1)) + bb,
tt = (bb>>1) - aa2*((b<<1)-1),
pxl, dw, dh;
if (w+1) while (y > 0)
{
if (st < 0)
{
st += bb*((x<<1)+3);
tt += (bb<<1)*(++x);
}
else if (tt < 0)
{
st += bb*((x<<1)+3) - aa4*(y-1);
pxl = cx-x;
dw = (x<<1)+wod;
tt += (bb<<1)*(++x) - aa2*(((y--)<<1)-3);
dh = oy-y;
this.mkDiv(pxl, cy-oy, dw, dh);
this.mkDiv(pxl, cy+oy-dh+hod, dw, dh);
ox = x;
oy = y;
}
else
{
tt -= aa2*((y<<1)-3);
st -= aa4*(--y);
}
}
this.mkDiv(cx-a, cy-oy, w+1, (oy<<1)+hod);
};

this.fillPolygon = function(array_x, array_y)
{
var i;
var y;
var miny, maxy;
var x1, y1;
var x2, y2;
var ind1, ind2;
var ints;

var n = array_x.length;

if (!n) return;


miny = array_y[0];
maxy = array_y[0];
for (i = 1; i < n; i++)
{
if (array_y[i] < miny)
miny = array_y[i];

if (array_y[i] > maxy)
maxy = array_y[i];
}
for (y = miny; y <= maxy; y++)
{
var polyInts = new Array();
ints = 0;
for (i = 0; i < n; i++)
{
if (!i)
{
ind1 = n-1;
ind2 = 0;
}
else
{
ind1 = i-1;
ind2 = i;
}
y1 = array_y[ind1];
y2 = array_y[ind2];
if (y1 < y2)
{
x1 = array_x[ind1];
x2 = array_x[ind2];
}
else if (y1 > y2)
{
y2 = array_y[ind1];
y1 = array_y[ind2];
x2 = array_x[ind1];
x1 = array_x[ind2];
}
else continue;

if ((y >= y1) && (y < y2))
polyInts[ints++] = Math.round((y-y1) * (x2-x1) / (y2-y1) + x1);

else if ((y == maxy) && (y > y1) && (y <= y2))
polyInts[ints++] = Math.round((y-y1) * (x2-x1) / (y2-y1) + x1);
}
polyInts.sort(integer_compare);

for (i = 0; i < ints; i+=2)
{
w = polyInts[i+1]-polyInts[i]
this.mkDiv(polyInts[i], y, polyInts[i+1]-polyInts[i]+1, 1);
}
}
};


this.drawString = function(txt, x, y)
{
this.htm += '<div style="position:absolute;white-space:nowrap;'+
'left:' + x + 'px;'+
'top:' + y + 'px;'+
'font-family:' + this.ftFam + ';'+
'font-size:' + this.ftSz + ';'+
'color:' + this.color + ';' + this.ftSty + '">'+
txt +
'<\/div>';
}


this.drawImage = function(imgSrc, x, y, w, h)
{
this.htm += '<div style="position:absolute;'+
'left:' + x + 'px;'+
'top:' + y + 'px;'+
'width:' + w + ';'+
'height:' + h + ';">'+
'<img src="' + imgSrc + '" width="' + w + '" height="' + h + '">'+
'<\/div>';
}


this.clear = function()
{
this.htm = "";
if (this.cnv) this.cnv.innerHTML = this.defhtm;
};


this.mkOvQds = function(cx, cy, xl, xr, yt, yb, w, h)
{
this.mkDiv(xr+cx, yt+cy, w, h);
this.mkDiv(xr+cx, yb+cy, w, h);
this.mkDiv(xl+cx, yb+cy, w, h);
this.mkDiv(xl+cx, yt+cy, w, h);
};

this.setStroke(1);
this.setFont('verdana,geneva,helvetica,sans-serif', String.fromCharCode(0x31, 0x32, 0x70, 0x78), Font.PLAIN);
this.color = '#000000';
this.htm = '';
this.wnd = wnd || window;

if (!(jg_ie || jg_dom || jg_ihtm)) chkDHTM();
if (typeof id != 'string' || !id) this.paint = pntDoc;
else
{
this.cnv = document.all? (this.wnd.document.all[id] || null)
: document.getElementById? (this.wnd.document.getElementById(id) || null)
: null;
this.defhtm = (this.cnv && this.cnv.innerHTML)? this.cnv.innerHTML : '';
this.paint = jg_dom? pntCnvDom : jg_ie? pntCnvIe : jg_ihtm? pntCnvIhtm : pntCnv;
}

this.setPrintable(false);
}

function integer_compare(x,y)
{
return (x < y) ? -1 : ((x > y)*1);
}


分享到:
评论

相关推荐

    Javascript代码美化工具

    JS Beauty 是一款 Javascript 美化工具,它具有美化,净化,压缩和解压缩 Javascript 代码等功能: 1. 美化:将混乱的 Javascript 代码格式化为优美的带缩进的格式,适合阅读和修改。 2. 净化:去掉 Javascript ...

    非常实用的网页制作,JavaScript功能代码片段精选

    非常实用的网页制作,JavaScript功能代码片段精选,非常实用的网页制作,JavaScript功能代码片段精选,非常实用的网页制作,JavaScript功能代码片段精选。

    网页设计常用Javascript经典代码

    这些是常用的JS代码,设计网页或者写点小功能的时候可能会用到,来源互联网,自己整理了下,有不对的地方请大家多多指教!

    常用javascript特效代码(带预览功能)

    资源名称:常用Javascript特效代码(带预览功能)   内容简介: 常用Javascript特效代码集锦,带有演示,左侧是特效分类及名称,点击后在右侧窗口中可预览效果,点右键可查看源代码,非常...

    40个直接可以拿来用的JavaScript实用功能代码

    由JquerySchool网站(http://www.jq-school.com/)整理分享,主要是方便网友们使用,减少开发的工作量,直接可以拿来用,先分享40个实用功能封装代码

    javascript代码常用大全

    4.3 判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母 4.4 字符串替换函数.Replace(); 5、浏览器类 5.1 判断浏览器的类型 5.2 判断ie的版本 5.3 判断客户端的分辨率 6、结合类 6.1...

    分享100个直接可以拿来用的JavaScript实用功能代码片段

    把平时网站上常用的一些实用功能代码片段通通收集起来,方面网友们学习使用,利用好的话可以加快网友们的开发速度,提高工作效率。

    100个直接可以拿来用的JavaScript实用功能代码片段(1-10)

    60、原生JavaScript时间个性化输出功能 61、原生JavaScript解决offsetX兼容性问题 62、原生JavaScript常用的正则表达式 63、原生JavaScript实现返回顶部的通用方法 64、原生JavaScript获得URL中GET参数值 65、原生...

    javascript 常用代码大全

    4.3 判断字符由字母和数字,下划线,点号组成.且开头的只能是下划线和字母 4.4 字符串替换函数.replace(); 5、浏览器类 5.1 判断浏览器的类型 5.2 判断ie的版本 5.3 判断客户端的分辨率 6、结合类 6.1...

    asp.net 网页常用Javascript代码

    asp.net编程中常需要编写一些代码完成特定功能,Javascript可以轻松帮你完成这些。

    100个直接可以拿来用的JavaScript实用功能代码片段

    JavaScript直接可以拿来用,实用功能代码

    【JavaScript源代码】JavaScript实现表单验证功能.docx

     本文实例为大家分享了JavaScript实现表单验证功能的具体代码,供大家参考,具体内容如下 以下是JavaScript的表单验证功能,可根据JS代码编写出你想要的HTML和CSS的代码。  关于正则表达式的使用,以及常用的正则...

    JavaScript 代码压缩加密软件

    此外,很多程序辛辛苦苦的写出来的javascript代码却被别人随意的剽窃,实为憾事。本软件还可以通过对javascript的变量名称和过程名称进行编码,从而起到混淆ja代码的作用,保护您的劳动成功。 JS代码压缩,基本原理...

    JavaScript 常用功能代码

    NULL 博文链接:https://dyccsxg.iteye.com/blog/771832

    JavaScript完全自学宝典 源代码

    示例描述:介绍JavaScript管理cookie和userData。 11.1.html JavaScript写数据到cookie。 11.2.html JavaScript获取cookie信息。 11.3.html JavaScript修改cookie的保存有效期。 11.4.html 保存数据...

    JavaScript Editor

    它提供了简单而且实用的功能:丰富的代码编辑功能(JavaScript, HTML, CSS, VBScript, PHP ,ASP(Net)),语法高亮,内置预览功能,提供了完整的HTML 标记, HTML 属性, HTML 事件, JavaScript 事件和JavaScript 函数等...

    WebGIS从基础到开发实践代码(基于ArcGIS API for JavaScript)

    1.2.4OWS中的常用服务 1.2.5服务的请求与响应 1.3REST及REST风格的Web服务 1.3.1REST中的基础知识 1.3.2REST风格的Web服务 1.3.3REST风格的Web服务实例 1.4Web GIS的组成 1.5ArcGIS Server REST风格的Web服务 1.5.1...

    javascript——PDF教程大合集.rar

    1、100个直接可以拿来用的JavaScript实用功能代码片段 2、JavaScript DOM编程艺术(中文) 3、JavaScript高级程序设计(第3版)中文 高清 完整 4、JavaScript脚本特效编程给力起飞 5、JavaScript权威指南(第6版)...

    javaScript一些常用功能

    javaScript一些常用功能代码 js属性代码 (10,1) type=button value=属性&gt; &lt;OBJECT classid=CLSID:8856F961-340A-11D0-A96B-00C04FD705A2 height=0 id=WebBrowser width=0&gt;&lt;/OBJECT&gt; 可能提示“权限不足”

Global site tag (gtag.js) - Google Analytics