欢迎访问 夜阑小雨 我的学习碎片档案,这里记录了我的学习内容和工作中经验,希望给您带去帮助。

javascript 常用代码大全(强烈推荐)

javascript 夜阑小雨 1138℃ 0评论

javascript 常用代码大全(超级收藏,强烈推荐)(1)

javascript 常用代码大全(超级收藏,强烈推荐)(2)

javascript 常用代码大全(超级收藏,强烈推荐)(3)

javascript 常用代码大全(超级收藏,强烈推荐)(4)

打开模式对话框
返回模式对话框的值
全屏幕打开 IE 窗口
脚本中中使用xml
一、验证类
1、数字验证内
2、时间类
3、表单类
4、字符类
5、浏览器类
6、结合类

二、功能类
1、时间与相关控件类
2、表单类
3、打印类
4、事件类
5、网页设计类
6、树型结构。
7、无边框效果的制作
8、连动下拉框技术
9、文本排序
10,画图类,含饼、柱、矢量贝滋曲线
11,操纵客户端注册表类
12,DIV层相关(拖拽、显示、隐藏、移动、增加)
13,TABLAE相关(客户端动态增加行列,模拟进度条,滚动列表等)
14,各种object classid=>相关类,如播放器,flash与脚本互动等
16, 刷新/模拟无刷新 异步调用类(XMLHttp或iframe,frame)

一个可以在页面上随意画线、多边形、圆,填充等功能的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;’+
‘ 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);
}

  

  

  

  

       JS 中,一些东西不可用的三种展现方式。
我们在WEB项目中,有时候需要在用户点击某个东西的时候,一些东西不可用。如果在客户端实现。最简单的就是利用disabled 。下面罗列的其中三种方式:依次是:不可用(disabled);用一个空白来代替这个地方(Blank);这个区域为空(None)。具体可以查看这个Blog的源文件:
obj.disabled = false;

obj.style.visibility = “hidden”;

obj.style.display = “none”;

<SCRIPT language=javascript>
function ShowDisableObject(obj)
{
if(obj.disabled == false)
{
      obj.disabled = true;
}
else{
      obj.disabled = false;
}
var coll = obj.all.tags(“INPUT”);
if (coll!=null)
{
      for (var i=0; i<coll.length; i++)
      {
       coll[i].disabled = obj.disabled;
      }
}
}

function ShowBlankObject(obj)
{
if(obj.style.visibility == “hidden”)
{
      obj.style.visibility = “visible”;
}
else
{
      obj.style.visibility = “hidden”;
}
}

function ShowNoneObject(obj)
{
if(obj.style.display == “none”)
{
      obj.style.display = “block”;
}
else
{
      obj.style.display = “none”;
}
}

</SCRIPT>

<P></P>
<DIV id=Show01>dadd
<DIV>ccc</DIV><INPUT> <INPUT type=checkbox> </DIV>
<P><INPUT onclick=ShowDisableObject(Show01); type=button value=Disable> <INPUT id=Button1 onclick=ShowBlankObject(Show01); type=button value=Blank name=Button1> <INPUT id=Button2 onclick=ShowNoneObject(Show01); type=button value=None name=Button2> </P><!–演示代码结束//–>

On this page I explain a simple DHTML example script that features invisibility, moving and the changing of text colour.

Example
Test TextMake test text invisible.
Make test text visible.
Move test text 50 pixels down.
Move test text 50 pixels up.
Change colour to red.
Change colour to blue.
Change colour to black.
Change the font style to italic.
Change the font style to normal.
Change the font family to ‘Times’.
Change the font family to ‘Arial’.

The script
The scripts work on this HTML element:

<DIV ID=”text”>Test Text</DIV>

#text {position: absolute;
top: 400px;
left: 400px;
font: 18px arial;
font-weight: 700;
}

These scripts are necessary for the three effects:

var DHTML = (document.getElementById || document.all || document.layers);

function getObj(name)
{
      if (document.getElementById)
      {
      this.obj = document.getElementById(name);
this.style = document.getElementById(name).style;
      }
      else if (document.all)
      {
this.obj = document.all[name];
this.style = document.all[name].style;
      }
      else if (document.layers)
      {
       this.obj = document.layers[name];
       this.style = document.layers[name];
      }
}

function invi(flag)
{
if (!DHTML) return;
var x = new getObj(‘text’);
x.style.visibility = (flag) ? ‘hidden’ : ‘visible’
}

var texttop = 400;

function move(amount)
{
if (!DHTML) return;
var x = new getObj(‘text’);
texttop += amount;
x.style.top = texttop;
}

function changeCol(col)
{
if (!DHTML) return;
var x = new getObj(‘text’);
x.style.color = col;
}

一段实现

(由于文字内容太长,所以只能放上来链接)

转载请注明:夜阑小雨 » javascript 常用代码大全(强烈推荐)

喜欢 (0)or分享 (0)
发表我的评论
取消评论

表情

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址