兼容ie Firefox的复制JS

<script language="javascript">
function copyToClipboard(txt) {   
     if(navigator.userAgent.indexOf("MSIE")>0) {      
              window.clipboardData.clearData();      
              window.clipboardData.setData("Text", txt);      
      } else if(navigator.userAgent.indexOf("Opera") != -1) {      
           window.location = txt;      
      } else if (window.netscape) {      
          try {      
                netscape.security.PrivilegeManager.enablePrivilege("UniversalXPConnect");      
           } catch (e) {      
                alert("被浏览器拒绝!\n请在浏览器地址栏输入’about:config’并回车\n然后将’signed.applets.codebase_principal_support’设置为’true’");      
           }      
          var clip = Components.classes[‘@mozilla.org/widget/clipboard;1′].createInstance(Components.interfaces.nsIClipboard);      
          if (!clip)      
               return;      
          var trans = Components.classes[‘@mozilla.org/widget/transferable;1′].createInstance(Components.interfaces.nsITransferable);      
          if (!trans)      
               return;      
           trans.addDataFlavor(‘text/unicode’);      
          var str = new Object();      
          var len = new Object();      
          var str = Components.classes["@mozilla.org/supports-string;1"].createInstance(Components.interfaces.nsISupportsString);      
          var copytext = txt;      
           str.data = copytext;      
           trans.setTransferData("text/unicode",str,copytext.length*2);      
          var clipid = Components.interfaces.nsIClipboard;      
          if (!clip)      
               return false;      
           clip.setData(trans,null,clipid.kGlobalClipboard);      
            alert("复制成功!")     
      }
       
}
</script>

网页编码

<%@ CODEPAGE=932 %>
<% Response.CodePage=932%>
<% Response.Charset="shift-jis" %>
<meta http-equiv="Content-Type" content="text/html; charset=shift-jis">

<%@ CODEPAGE=65001 %>
<% Response.CodePage=65001%>
<% Response.Charset="UTF-8" %>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<%@ CODEPAGE=936 %>
<% Response.CodePage=936%>
<% Response.Charset="gb2312" %>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">

这里有几 个要点 1,如果只有 而没有的话在不同系统里读取表单、存储数据库的时候编码有所不同,即如果页面只有 通过这样读、存,然后到页面显示的时候回乱码,不要看到都是gb2312就不会乱了。不过如果都在中文系统下问题不大应该。这里只是用GB2312举例 2,发送邮件问题 GB2312和shift-jis都很默契的可以转化为utf-8编码,也就是说GB2312和shift-jis编码的内容可以通过utf-8格式发送,但是反之不行。所以建议发送邮件三个步骤即表单也,数据处理页,邮件发送页编码统一,这样在不同系统里接受起来也不会乱码了。

类似discuz图片加载效果

function $(a){return document.getElementById(a);}
function hidden_div(obj){$(obj).style.display=’none';}
//透明层
function showMask(){
        if($("tianyi-Mask"))
        {var oMask=$("tianyi-Mask");}
        else
        {
                var oMask=document.createElement("DIV");
                        oMask.id="tianyi-Mask";
                        oMask.style.cssText = "position:absolute;left:0px;top:0px;background:#000;filter:Alpha(opacity=60);opacity:0.6";
                document.body.appendChild(oMask);
        }
                oMask.style.display = "block";
                oMask.style.width = document.documentElement.scrollWidth + "px";
                oMask.style.height = document.documentElement.scrollHeight + "px";
}

function showajaxdiv(obj,content,width,height,sty)
{
        if($("tianyi-"+obj))
        {
                var oDiv=$("tianyi-"+obj);
        }
        else
        {
                var oDiv=document.createElement("DIV");
                        oDiv.id="tianyi-"+obj;
                        oDiv.className="ajaxdiv";
                document.body.appendChild(oDiv);
        }
        var st = window.pageYOffset || document.documentElement.scrollTop;
        var sl = window.pageXOffset || document.documentElement.scrollLeft;
        var bt = document.documentElement.clientHeight-height;
        var bl = document.documentElement.clientWidth-width;
        var top=(bt/2)+st-5;
        var left=(bl/2)+sl;
        var oDivStyle=oDiv.style;
                oDivStyle.display="";
                oDivStyle.width=width+"px";
                oDivStyle.top=top+"px";
                oDivStyle.left=left+"px";
                oDivStyle.position=’absolute';
                oDivStyle.fontSize=’12px';
                if (sty==1)
                {
                        oDivStyle.padding=’8px';
                        oDivStyle.backgroundColor=’#FFFBDF';
                        oDivStyle.color=’#f10′;
                        oDivStyle.border=’1 solid #EF9B8F';
                }
                else
                {
                        oDivStyle.padding=’5px';
                        oDivStyle.backgroundColor=’#AAA';
                        oDivStyle.color=’#fff';
                        oDivStyle.border=’0′;
                }
                oDivStyle.textAlign=’center';
                oDiv.innerHTML=content;
}
//提示
function Msg(content){
        showajaxdiv("msg",content,200,30,1)
        setTimeout("hidden_div(‘tianyi-msg’);",2000);
}

function showimg(url) {
var wx=document.documentElement.clientWidth-40
var hx=document.documentElement.clientHeight-90
var img = new Image();
   src_big=url.substr(0,url.length-4)+"_big"+url.substr(url.length-4,4);
   src_small=url
        img.src = src_big;
        showajaxdiv("imgline","图片加载中……",200,30);
        img.complete?ImgOK():img.onload=ImgOK;
   img.onerror=function(){
    img.src = src_small;
        showajaxdiv("imgline","图片加载中……",200,30);
        img.complete?ImgOK():img.onload=ImgOK;
    }
        function ImgOK(){
                showMask()
                var width=img.width;
                var height=img.height;
                if(width>wx){height=(wx/width)*height;width=wx;}
                if(height>hx){width=(hx/height)*width;height=hx;}
    
                $("tianyi-imgline").style.display=’none';
                var pstr="<a href="+img.src+" target=\"_blank\"><img src=\"img/newwindow.gif\" title=\"查看原图\" style=\"cursor:pointer;border:0px;position:absolute;right:15px;top:15px;\"></a>"
                showajaxdiv("img",pstr+"<img src="+img.src+" onclick=\"hidden_div(‘tianyi-Mask’);hidden_div(‘tianyi-img’);\" style=\"cursor:pointer;width:"+width+"px;height:"+height+"px;\" title=\"点击关闭\">",width,height,0);return;}
}

<img src="<%=rsgoods("big_pic3")%>" class="small"   onclick="showimg(this.src)">

JS单选框组的判断

取值只要request(chongzhi_select);

如何在IE8中默认使用兼容模式浏览网页

在<head>中加入如下代码:
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

content="IE=EmulateIE7"标签意义解释:
EmulateIE7 模式通知 Windows Internet Explorer 使用 <!DOCTYPE> 指令确定如何呈现内容。标准模式指令以 Windows Internet Explorer 7 标准模式显示,而 Quirks 模式指令以 IE5 模式显示。与IE7 模式不同,EmulateIE7 模式遵循 <!DOCTYPE> 指令。对于多数网站来说,它是首选的兼容性模式。

Content 属性指定了该页面的模式;例如,要模仿 Windows Internet Explorer 7 的行为,请指定 IE=EmulateIE7。同样,可指定 IE=5、IE=7 或 IE=8 以选择其中一种兼容性模式。您还可以指定 IE=edge 以通知 Windows Internet Explorer 8 使用最高级别的可用模式。

X-UA-compatible 标头不区分大小写;但是,它必须显示在网页中除 TITLE 和其他 META 元素以外的所有元素之前的标头(HEAD 部分)中。

Javascript判断IE8如下代码:

engine = null;
if (window.navigator.appName == "Microsoft Internet Explorer")
{
   // 这是一个 IE 浏览器。引擎处于哪种模式下?
   if (document.documentMode) // IE8
      engine = document.documentMode;
   else // IE 5-7
   {
      engine = 5; // 假设为 quirks 模式;除非另外证实是其他模式
      if (document.compatMode)
      {
         if (document.compatMode == "CSS1Compat")
            engine = 7; // 标准模式
      }
   }
   // 引擎变量现在包含文本兼容性模式。
}

一个兼容IE、Firefox和Opera浏览器的英文日历脚本(2)

sHTML = "<tr><td align=’center’ onmouseover=’this.style.backgroundColor=\"#FFCC99\"’ onmouseout=’clearInterval(intervalID1);this.style.backgroundColor=\"\"’ style=’cursor:pointer’ onmousedown=’clearInterval(intervalID1);intervalID1=setInterval(\"upMonth()\",30)’ onmouseup=’clearInterval(intervalID1)’>-</td></tr>"

   j=0;
   i=(monthSelected-3);
   if(i < 0)
    i=0;
   if(i > 6)
    i=6;
   nStartingMonth = i;
   for (ii=0; ii<6; ii++, i++, j++)
   {
    sName = monthName[i];
    if (i==monthSelected)
    {
     sName = "<B>" + sName + "</B>"
    }
    sHTML += "<tr><td id=’m" + j + "’ onmouseover=’this.style.backgroundColor=\"#FFCC99\"’ onmouseout=’this.style.backgroundColor=\"\"’ style=’cursor:pointer’ onclick=’selectMonth(" + j + ");event.cancelBubble=true’>&nbsp;" + sName + "&nbsp;</td></tr>"
   }

   sHTML += "<tr><td align=’center’ onmouseover=’this.style.backgroundColor=\"#FFCC99\"’ onmouseout=’clearInterval(intervalID2);this.style.backgroundColor=\"\"’ style=’cursor:pointer’ onmousedown=’clearInterval(intervalID2);intervalID2=setInterval(\"downMonth()\",30)’ onmouseup=’clearInterval(intervalID2)’>+</td></tr>"

   document.getElementById("selectMonth").innerHTML = "<table width=32 style=’font-family:arial; font-size:11px; border-width:1; border-style:solid; border-color:#a0a0a0;’ bgcolor=’#FFFFDD’ cellspacing=0 onmouseover=’clearTimeout(timeoutID1)’ onmouseout=’clearTimeout(timeoutID1);timeoutID1=setTimeout(\"popDownMonth()\",100);event.cancelBubble=true’>" + sHTML + "</table>"

   monthConstructed=true
}
}
function popUpMonth()
{
constructMonth()
crossMonthObj.visibility = (dom||ie)? "visible" : "show"
crossMonthObj.left = parseInt(crossobj.left) + 50
crossMonthObj.top = parseInt(crossobj.top) + 26

hideElement( ‘SELECT’, document.getElementById("selectMonth") );
hideElement( ‘APPLET’, document.getElementById("selectMonth") );  
}

function popDownMonth()
{
crossMonthObj.visibility= "hidden"
}

/*** Year Pulldown ***/

function incYear()
{
for (i=0; i<6; i++)
{
   newYear = (i+nStartingYear)+1
   if (newYear==yearSelected)
   {
    txtYear = "&nbsp;<B>" + newYear + "</B>&nbsp;"
   }
   else
   {
    txtYear = "&nbsp;" + newYear + "&nbsp;"
   }
   document.getElementById("y"+i).innerHTML = txtYear
}
nStartingYear ++;
bShow=true
}

function decYear()
{
for (i=0; i<6; i++)
{
   newYear = (i+nStartingYear)-1
   if (newYear==yearSelected)
   {
    txtYear = "&nbsp;<B>" + newYear + "</B>&nbsp;"
   }
   else
   {
    txtYear = "&nbsp;" + newYear + "&nbsp;"
   }
   document.getElementById("y"+i).innerHTML = txtYear
}
nStartingYear –;
bShow=true
}

function selectYear(nYear)
{
yearSelected=parseInt(nYear+nStartingYear);
yearConstructed=false;
constructCalendar();
popDownYear();
}

function constructYear()
{
popDownMonth()
sHTML = ""
if (!yearConstructed)
{

   sHTML = "<tr><td align=’center’ onmouseover=’this.style.backgroundColor=\"#FFCC99\"’ onmouseout=’clearInterval(intervalID1);this.style.backgroundColor=\"\"’ style=’cursor:pointer’ onmousedown=’clearInterval(intervalID1);intervalID1=setInterval(\"decYear()\",30)’ onmouseup=’clearInterval(intervalID1)’>-</td></tr>"

   j = 0
   nStartingYear = yearSelected-3
   for (i=(yearSelected-3); i<(yearSelected+3); i++)
   {
    sName = i;
    if (i==yearSelected)
    {
     sName = "<B>" + sName + "</B>"
    }

    sHTML += "<tr><td id=’y" + j + "’ onmouseover=’this.style.backgroundColor=\"#FFCC99\"’ onmouseout=’this.style.backgroundColor=\"\"’ style=’cursor:pointer’ onclick=’selectYear("+j+");event.cancelBubble=true’>&nbsp;" + sName + "&nbsp;</td></tr>"
    j ++;
   }

   sHTML += "<tr><td align=’center’ onmouseover=’this.style.backgroundColor=\"#FFCC99\"’ onmouseout=’clearInterval(intervalID2);this.style.backgroundColor=\"\"’ style=’cursor:pointer’ onmousedown=’clearInterval(intervalID2);intervalID2=setInterval(\"incYear()\",30)’ onmouseup=’clearInterval(intervalID2)’>+</td></tr>"

   document.getElementById("selectYear").innerHTML = "<table width=44 style=’font-family:arial; font-size:11px; border-width:1; border-style:solid; border-color:#a0a0a0;’ bgcolor=’#FFFFDD’ onmouseover=’clearTimeout(timeoutID2)’ onmouseout=’clearTimeout(timeoutID2);timeoutID2=setTimeout(\"popDownYear()\",100)’ cellspacing=0>" + sHTML + "</table>"

   yearConstructed = true
}
}

function popDownYear()
{
clearInterval(intervalID1)
clearTimeout(timeoutID1)
clearInterval(intervalID2)
clearTimeout(timeoutID2)
crossYearObj.visibility= "hidden"
}

function popUpYear()
{
var leftOffset

constructYear()
crossYearObj.visibility = (dom||ie)? "visible" : "show"
leftOffset = parseInt(crossobj.left) + document.getElementById("spanYear").offsetLeft
if (ie)
{
   leftOffset += 6
}
crossYearObj.left = leftOffset
crossYearObj.top = parseInt(crossobj.top) + 26
}

/*** calendar ***/
   function WeekNbr(n)
   {
      // Algorithm used:
      // From Klaus Tondering’s Calendar document (The Authority/Guru)
      // hhtp://www.tondering.dk/claus/calendar.html
      // a = (14-month) / 12
      // y = year + 4800 – a
      // m = month + 12a – 3
      // J = day + (153m + 2) / 5 + 365y + y / 4 – y / 100 + y / 400 – 32045
      // d4 = (J + 31741 – (J mod 7)) mod 146097 mod 36524 mod 1461
      // L = d4 / 1460
      // d1 = ((d4 – L) mod 365) + L
      // WeekNumber = d1 / 7 + 1

      year = n.getFullYear();
      month = n.getMonth() + 1;
      if (startAt == 0)
      {
         day = n.getDate() + 1;
      }
      else
      {
         day = n.getDate();
      }

      a = Math.floor((14-month) / 12);
      y = year + 4800 – a;
      m = month + 12 * a – 3;
      b = Math.floor(y/4) – Math.floor(y/100) + Math.floor(y/400);
      J = day + Math.floor((153 * m + 2) / 5) + 365 * y + b – 32045;
      d4 = (((J + 31741 – (J % 7)) % 146097) % 36524) % 1461;
      L = Math.floor(d4 / 1460);
      d1 = ((d4 – L) % 365) + L;
      week = Math.floor(d1/7) + 1;

      return week;
   }

function constructCalendar ()
{
var aNumDays = Array (31,0,31,30,31,30,31,31,30,31,30,31)

var dateMessage
var startDate = new Date (yearSelected,monthSelected,1)
var endDate

if (monthSelected==1)
{
   endDate = new Date (yearSelected,monthSelected+1,1);
   endDate = new Date (endDate – (24*60*60*1000));
   numDaysInMonth = endDate.getDate()
}
else
{
   numDaysInMonth = aNumDays[monthSelected];
}

datePointer = 0
dayPointer = startDate.getDay() – startAt

if (dayPointer<0)
{
   dayPointer = 6
}

sHTML = "<table border=0 style=’font-family:verdana;font-size:10px;’><tr>"

if (showWeekNumber==1)
{
   sHTML += "<td width=27><b>" + weekString + "</b></td><td width=1 rowspan=7 bgcolor=’#d0d0d0′ style=’padding:0px’><img src=’"+imgDir+"divider.gif’ width=1></td>"
}

for (i=0; i<7; i++)
{
   sHTML += "<td width=’27’ align=’right’><B>"+ dayName[i]+"</B></td>"
}
sHTML +="</tr><tr>"

if (showWeekNumber==1)
{
   sHTML += "<td align=right>" + WeekNbr(startDate) + "&nbsp;</td>"
}

for ( var i=1; i<=dayPointer;i++ )
{
   sHTML += "<td>&nbsp;</td>"
}

for ( datePointer=1; datePointer<=numDaysInMonth; datePointer++ )
{
   dayPointer++;
   sHTML += "<td align=right>"
   sStyle=styleAnchor
   if ((datePointer==odateSelected) && (monthSelected==omonthSelected) && (yearSelected==oyearSelected))
   { sStyle+=styleLightBorder }

   sHint = ""
   for (k=0;k<HolidaysCounter;k++)
   {
    if ((parseInt(Holidays[k].d)==datePointer)&&(parseInt(Holidays[k].m)==(monthSelected+1)))
    {
     if ((parseInt(Holidays[k].y)==0)||((parseInt(Holidays[k].y)==yearSelected)&&(parseInt(Holidays[k].y)!=0)))
     {
      sStyle+="background-color:#FFDDDD;"
      sHint+=sHint==""?Holidays[k].desc:"\n"+Holidays[k].desc
     }
    }
   }

   var regexp= /\"/g
   sHint=sHint.replace(regexp,"&quot;")

   dateMessage = "onmousemove=’window.status=\""+selectDateMessage.replace("[date]",constructDate(datePointer,monthSelected,yearSelected))+"\"’ onmouseout=’window.status=\"\"’ "

   if ((datePointer==dateNow)&&(monthSelected==monthNow)&&(yearSelected==yearNow))
   {
    sHTML += "<b><a "+dateMessage+" title=\"" + sHint + "\" style=’"+sStyle+"’ href=’javascript:dateSelected="+datePointer+";closeCalendar();’><font color=#ff0000>&nbsp;" + datePointer + "</font>&nbsp;</a></b>"
   }
   else if (dayPointer % 7 == (startAt * -1)+1)
   {
    sHTML += "<a "+dateMessage+" title=\"" + sHint + "\" style=’"+sStyle+"’ href=’javascript:dateSelected="+datePointer + ";closeCalendar();’>&nbsp;<font color=#909090>" + datePointer + "</font>&nbsp;</a>"
   }
   else
   {
    sHTML += "<a "+dateMessage+" title=\"" + sHint + "\" style=’"+sStyle+"’ href=’javascript:dateSelected="+datePointer + ";closeCalendar();’>&nbsp;" + datePointer + "&nbsp;</a>"
   }

   sHTML += ""
   if ((dayPointer+startAt) % 7 == startAt)
   {
    sHTML += "</tr><tr>"
    if ((showWeekNumber==1)&&(datePointer<numDaysInMonth))
    {
     sHTML += "<td align=right>" + (WeekNbr(new Date(yearSelected,monthSelected,datePointer+1))) + "&nbsp;</td>"
    }
   }
}

document.getElementById("content").innerHTML   = sHTML
document.getElementById("spanMonth").innerHTML = "&nbsp;" + monthName[monthSelected] + "&nbsp;<IMG id=’changeMonth’ SRC=’"+imgDir+"drop1.gif’ WIDTH=’12’ HEIGHT=’10’ BORDER=0>"
document.getElementById("spanYear").innerHTML = "&nbsp;" + yearSelected + "&nbsp;<IMG id=’changeYear’ SRC=’"+imgDir+"drop1.gif’ WIDTH=’12’ HEIGHT=’10’ BORDER=0>"
}

function popUpCalendar(ctl, ctl2, format)
{
var leftpos=0
var toppos=0

if (bPageLoaded)
{
   if ( crossobj.visibility == "hidden" )
   {
    ctlToPlaceValue = ctl2
    dateFormat=format;

    formatChar = " "
    aFormat = dateFormat.split(formatChar)
    if (aFormat.length<3)
    {
     formatChar = "/"
     aFormat = dateFormat.split(formatChar)
     if (aFormat.length<3)
     {
      formatChar = "."
      aFormat = dateFormat.split(formatChar)
      if (aFormat.length<3)
      {
       formatChar = "-"
       aFormat = dateFormat.split(formatChar)
       if (aFormat.length<3)
       {
        // invalid date format
        formatChar=""
       }
      }
     }
    }

    tokensChanged = 0
    if ( formatChar != "" )
    {
     // use user’s date
     aData = ctl2.value.split(formatChar)

     for (i=0;i<3;i++)
     {
      if ((aFormat[i]=="d") || (aFormat[i]=="dd"))
      {
       dateSelected = parseInt(aData[i], 10)
       tokensChanged ++
      }
      else if ((aFormat[i]=="m") || (aFormat[i]=="mm"))
      {
       monthSelected = parseInt(aData[i], 10) – 1
       tokensChanged ++
      }
      else if (aFormat[i]=="yyyy")
      {
       yearSelected = parseInt(aData[i], 10)
       tokensChanged ++
      }
      else if (aFormat[i]=="mmm")
      {
       for (j=0; j<12; j++)
       {
        if (aData[i]==monthName[j])
        {
         monthSelected=j
         tokensChanged ++
        }
       }
      }
      else if (aFormat[i]=="mmmm")
      {
       for (j=0; j<12; j++)
       {
        if (aData[i]==monthName2[j])
        {
         monthSelected=j
         tokensChanged ++
        }
       }
      }
     }
    }

    if ((tokensChanged!=3)||isNaN(dateSelected)||isNaN(monthSelected)||isNaN(yearSelected))
    {
     dateSelected = dateNow
     monthSelected = monthNow
     yearSelected = yearNow
    }

    odateSelected=dateSelected
    omonthSelected=monthSelected
    oyearSelected=yearSelected

    aTag = ctl
    do
    {
     aTag = aTag.offsetParent;
     leftpos += aTag.offsetLeft;
     toppos += aTag.offsetTop;
    } while(aTag.tagName!="BODY");

    crossobj.left = fixedX==-1 ? ctl.offsetLeft + leftpos : fixedX
    crossobj.top = fixedY==-1 ? ctl.offsetTop + toppos + ctl.offsetHeight + 2 : fixedY
    constructCalendar (1, monthSelected, yearSelected);
    crossobj.visibility=(dom||ie)? "visible" : "show"

    hideElement( ‘SELECT’, document.getElementById("calendar") );
    hideElement( ‘APPLET’, document.getElementById("calendar") );  

    bShow = true;
   }
   else
   {
    hideCalendar()
    if (ctlNow!=ctl) {popUpCalendar(ctl, ctl2, format)}
   }
   ctlNow = ctl
}
}

document.onkeypress = function hidecal1 ()
{
if (event.keyCode==27)
{
   hideCalendar()
}
}
document.onclick = function hidecal2 ()
{  
if (!bShow)
{
   hideCalendar()
}
bShow = false
}

if(ie)
{
init()
}
else
{
window.onload=init
}
//–>
      </SCRIPT>
</head>
<body>
     <table><tr><td><INPUT id="Text1" onclick=’popUpCalendar(this, this, " mm/dd/yyyy")’ readOnly type="text"
         size="11" name="Text1"></td></tr></table>
</body>
</html>

  说明:close.gif、drop1.gif、drop2.gif、left1.gif、left2.gif、right1.gif、right2.gif分别为关闭图片(14*13)、向下的箭头1(11*10)、向下的箭头2(11*10)、向左的箭头1(10*11)、向左的箭头2(10*11)、向右的箭头1(10*11)、向右的箭头2(10*11)

一个兼容IE、Firefox和Opera浏览器的英文日历脚本(1)

<html>
<head>
      <SCRIPT language="javascript">
      <!–
var fixedX = -1   // x position (-1 if to appear below control)
var fixedY = -1   // y position (-1 if to appear below control)
var startAt = 1   // 0 – sunday ; 1 – monday
var showWeekNumber = 0 // 0 – don’t show; 1 – show
var showToday = 0 // 0 – don’t show; 1 – show
//var imgDir = "pic/calendar/"   // directory for images … e.g. var imgDir="/img/"
var imgDir = "../../Inc/image/"

var gotoString = "Go To Current Month"
var todayString = "Today is"
var weekString = "Wk"
var scrollLeftMessage = "Click to scroll to previous month. Hold mouse button to scroll automatically."
var scrollRightMessage = "Click to scroll to next month. Hold mouse button to scroll automatically."
var selectMonthMessage = "Click to select a month."
var selectYearMessage = "Click to select a year."
var selectDateMessage = "Select [date] as date." // do not replace [date], it will be replaced by date.

var crossobj, crossMonthObj, crossYearObj, monthSelected, yearSelected, dateSelected, omonthSelected, oyearSelected, odateSelected, monthConstructed, yearConstructed, intervalID1, intervalID2, timeoutID1, timeoutID2, ctlToPlaceValue, ctlNow, dateFormat, nStartingYear, nStartingMonth

var bPageLoaded=false

var ie = false;
var dom=document.getElementById

var ns4=document.layers
var today = new Date()
var dateNow = today.getDate()
var monthNow = today.getMonth()
var yearNow = today.getYear()
var imgsrc = new Array("drop1.gif","drop2.gif","left1.gif","left2.gif","right1.gif","right2.gif")
var img = new Array()

var bShow = false;

if((navigator.userAgent.toLowerCase().indexOf("opera") == -1) && (navigator.userAgent.toLowerCase().indexOf("msie") != -1))
{
    ie = true;
}

    /* hides <select> and <applet> objects (for IE only) */
    function hideElement( elmID, overDiv )
    {
      if( ie )
      {
        for( i = 0; i < document.all.tags( elmID ).length; i++ )
        {
          obj = document.all.tags( elmID )[i];
          if( !obj || !obj.offsetParent )
          {
            continue;
          }
     
          // Find the element’s offsetTop and offsetLeft relative to the BODY tag.
          objLeft   = obj.offsetLeft;
          objTop    = obj.offsetTop;
          objParent = obj.offsetParent;
         
          while( objParent.tagName.toUpperCase() != "BODY" )
          {
            objLeft += objParent.offsetLeft;
            objTop   += objParent.offsetTop;
            objParent = objParent.offsetParent;
          }
     
          objHeight = obj.offsetHeight;
          objWidth = obj.offsetWidth;
     
          if(( overDiv.offsetLeft + overDiv.offsetWidth ) <= objLeft );
          else if(( overDiv.offsetTop + overDiv.offsetHeight ) <= objTop );
          else if( overDiv.offsetTop >= ( objTop + objHeight ));
          else if( overDiv.offsetLeft >= ( objLeft + objWidth ));
          else
          {
            obj.style.visibility = "hidden";
          }
        }
      }
    }
    
    /*
    * unhides <select> and <applet> objects (for IE only)
    */
    function showElement( elmID )
    {
      if( ie )
      {
        for( i = 0; i < document.all.tags( elmID ).length; i++ )
        {
          obj = document.all.tags( elmID )[i];
         
          if( !obj || !obj.offsetParent )
          {
            continue;
          }
       
          obj.style.visibility = "";
        }
      }
    }

function HolidayRec (d, m, y, desc)
{
this.d = d
this.m = m
this.y = y
this.desc = desc
}

var HolidaysCounter = 0
var Holidays = new Array()

function addHoliday (d, m, y, desc)
{
Holidays[HolidaysCounter++] = new HolidayRec ( d, m, y, desc )
}

if (dom)
{
for (i=0;i<imgsrc.length;i++)
{
   img[i] = new Image
   img[i].src = imgDir + imgsrc[i]
}
document.write ("<div onclick=’bShow=true’ id=’calendar’ style=’z-index:+999;position:absolute;visibility:hidden;’><table width="+((showWeekNumber==1)?250:220)+" style=’font-family:arial;font-size:11px;border-width:1;border-style:solid;border-color:#a0a0a0;font-family:arial; font-size:11px}’ bgcolor=’#ffffff’><tr bgcolor=’#0000aa’><td><table width=’"+((showWeekNumber==1)?248:218)+"’><tr><td style=’padding:2px;font-family:arial; font-size:11px;’><font color=’#ffffff’><B><span id=’caption’></span></B></font></td><td align=right><a href=’javascript:hideCalendar()’><IMG SRC=’"+imgDir+"close.gif’ WIDTH=’15’ HEIGHT=’13’ BORDER=’0′ ALT=’Close the Calendar’></a></td></tr></table></td></tr><tr><td style=’padding:5px’ bgcolor=#ffffff><span id=’content’></span></td></tr>")
  
if (showToday==1)
{
   document.write ("<tr bgcolor=#f0f0f0><td style=’padding:5px’ align=center><span id=’lblToday’></span></td></tr>")
}
  
document.write ("</table></div><div id=’selectMonth’ style=’z-index:+999;position:absolute;visibility:hidden;’></div><div id=’selectYear’ style=’z-index:+999;position:absolute;visibility:hidden;’></div>");
}

var monthName = new Array("01","02","03","04","05","06","07","08","09","10","11","12")
var monthName2 = new Array("01","02","03","04","05","06","07","08","09","10","11","12")
if (startAt==0)
{
dayName = new Array ("Sun","Mon","Tue","Wed","Thu","Fri","Sat")
}
else
{
dayName = new Array ("Mon","Tue","Wed","Thu","Fri","Sat","Sun")
}
var styleAnchor="text-decoration:none;color:black;"
var styleLightBorder="border-style:solid;border-width:1px;border-color:#a0a0a0;"

function swapImage(srcImg, destImg)
{
if (ie)
{
   document.getElementById(srcImg).setAttribute("src",imgDir + destImg)
}
}

function init()
{
if (!ns4)
{
   if (!ie)
   {
    yearNow += 1900
   }

   crossobj=(dom)?document.getElementById("calendar").style : ie? document.all.calendar : document.calendar
   hideCalendar()

   crossMonthObj=(dom)?document.getElementById("selectMonth").style : ie? document.all.selectMonth : document.selectMonth

   crossYearObj=(dom)?document.getElementById("selectYear").style : ie? document.all.selectYear : document.selectYear

   monthConstructed=false;
   yearConstructed=false;

   if (showToday==1)
   {
    document.getElementById("lblToday").innerHTML = todayString + " <a onmousemove=’window.status=\""+gotoString+"\"’ onmouseout=’window.status=\"\"’ title=’"+gotoString+"’ style=’"+styleAnchor+"’ href=’javascript:monthSelected=monthNow;yearSelected=yearNow;constructCalendar();’>"+dayName[(today.getDay()-startAt==-1)?6:(today.getDay()-startAt)]+", " + dateNow + " " + monthName[monthNow].substring(0,3) + " " + yearNow + "</a>"
   }

   sHTML1="<span id=’spanLeft’ style=’border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer’ onmouseover=’swapImage(\"changeLeft\",\"left2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+scrollLeftMessage+"\"’ onclick=’javascript:decMonth()’ onmouseout=’clearInterval(intervalID1);swapImage(\"changeLeft\",\"left1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"’ onmousedown=’clearTimeout(timeoutID1);timeoutID1=setTimeout(\"StartDecMonth()\",500)’ onmouseup=’clearTimeout(timeoutID1);clearInterval(intervalID1)’>&nbsp<IMG id=’changeLeft’ SRC=’"+imgDir+"left1.gif’ width=10 height=11 BORDER=0>&nbsp</span>&nbsp;"
   sHTML1+="<span id=’spanRight’ style=’border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer’ onmouseover=’swapImage(\"changeRight\",\"right2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+scrollRightMessage+"\"’ onmouseout=’clearInterval(intervalID1);swapImage(\"changeRight\",\"right1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"’ onclick=’incMonth()’ onmousedown=’clearTimeout(timeoutID1);timeoutID1=setTimeout(\"StartIncMonth()\",500)’ onmouseup=’clearTimeout(timeoutID1);clearInterval(intervalID1)’>&nbsp<IMG id=’changeRight’ SRC=’"+imgDir+"right1.gif’ width=10 height=11 BORDER=0>&nbsp</span>&nbsp"
   sHTML1+="<span id=’spanMonth’ style=’border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer’ onmouseover=’swapImage(\"changeMonth\",\"drop2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+selectMonthMessage+"\"’ onmouseout=’swapImage(\"changeMonth\",\"drop1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"’ onclick=’popUpMonth()’></span>&nbsp;"
   sHTML1+="<span id=’spanYear’ style=’border-style:solid;border-width:1;border-color:#3366FF;cursor:pointer’ onmouseover=’swapImage(\"changeYear\",\"drop2.gif\");this.style.borderColor=\"#88AAFF\";window.status=\""+selectYearMessage+"\"’ onmouseout=’swapImage(\"changeYear\",\"drop1.gif\");this.style.borderColor=\"#3366FF\";window.status=\"\"’ onclick=’popUpYear()’></span>&nbsp;"
  
   document.getElementById("caption").innerHTML = sHTML1

   bPageLoaded=true
}
}

function hideCalendar()
{
crossobj.visibility="hidden"
if (crossMonthObj != null)
{
   crossMonthObj.visibility="hidden"
}
if (crossYearObj != null)
{
   crossYearObj.visibility="hidden"
}

     showElement( ‘SELECT’ );
showElement( ‘APPLET’ );
}

function padZero(num)
{
return (num < 10)? ‘0’ + num : num ;
}

function constructDate(d,m,y)
{
sTmp = dateFormat
sTmp = sTmp.replace ("dd","<e>")
sTmp = sTmp.replace ("d","<d>")
sTmp = sTmp.replace ("<e>",padZero(d))
sTmp = sTmp.replace ("<d>",d)
sTmp = sTmp.replace ("mmmm","<p>")
sTmp = sTmp.replace ("mmm","<o>")
sTmp = sTmp.replace ("mm","<n>")
sTmp = sTmp.replace ("m","<m>")
sTmp = sTmp.replace ("<m>",m+1)
sTmp = sTmp.replace ("<n>",padZero(m+1))
sTmp = sTmp.replace ("<o>",monthName[m])
sTmp = sTmp.replace ("<p>",monthName2[m])
sTmp = sTmp.replace ("yyyy",y)
return sTmp.replace ("yy",padZero(y%100))
}

function closeCalendar()
{
var sTmp

hideCalendar();
ctlToPlaceValue.value = constructDate(dateSelected,monthSelected,yearSelected)
}

/*** Month Pulldown ***/

function StartDecMonth()
{
intervalID1=setInterval("decMonth()",80)
}

function StartIncMonth()
{
intervalID1=setInterval("incMonth()",80)
}

function incMonth ()
{
monthSelected++
if (monthSelected>11)
{
   monthSelected=0
   yearSelected++
}
constructCalendar()
}

function decMonth ()
{
monthSelected–
if (monthSelected<0)
{
   monthSelected=11
   yearSelected–
}
constructCalendar()
}

function upMonth()
{
if(nStartingMonth > 0)
{
   nStartingMonth –;
   for (i=0; i<6; i++)
   {
    newMonth = (i + nStartingMonth);
    if (newMonth == monthSelected)
     txtMonth = "&nbsp;<B>" + monthName[newMonth] + "</B>&nbsp;";
    else
     txtMonth = "&nbsp;" + monthName[newMonth] + "&nbsp;";
    document.getElementById("m"+i).innerHTML = txtMonth;
   }
}
bShow=true
}

function downMonth()
{
if(nStartingMonth < 6)
{
   nStartingMonth ++;
   for (i=0; i<6; i++)
   {
    newMonth = (i + nStartingMonth);
    if (newMonth == monthSelected)
     txtMonth = "&nbsp;<B>" + monthName[newMonth] + "</B>&nbsp;";
    else
     txtMonth = "&nbsp;" + monthName[newMonth] + "&nbsp;";
    document.getElementById("m"+i).innerHTML = txtMonth;
   }
}
bShow=true
}

function selectMonth(nMonth)
{
monthSelected=parseInt(nMonth+nStartingMonth);
monthConstructed=false;
constructCalendar();
popDownMonth();
}

function constructMonth()
{
popDownYear()
if (!monthConstructed)
{

  

三级联动菜单–参考了别人的程序后加自己的修改,可以扩展

<!–#include file="conn.asp"–>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script language="JavaScript">
//option
    function addOption(objSelectNow,txt,val){
       for(var i=0;i<objSelectNow.length;i++){
           if(objSelectNow.options[i].value==val){
               return false;
           }
       }
       var   objOption   = document.createElement("OPTION");
       objOption.setAttribute("text",txt);
       objOption.setAttribute("value",val);
       objSelectNow.options.add(objOption);
    }
    //?selectн?
    function removeAllOptions(selectObject){
        while(selectObject.length>0){
            selectObject.options[0] = null;
        }
    }
//
    function AreaSet(){
        this.all = [];
    }
    AreaSet.prototype.addArea = function(o){
        this.all[this.all.length] = o;
    }
    //
    function Area(areaid,areanm){
        this.areaid = areaid;
        this.areanm= areanm;
        this.cityAll = [];
    }
    Area.prototype.addCity = function(o){
        if(!o) return;
        if(o.cityid == null)return;
        this.cityAll[this.cityAll.length] = o;
    }
    //
    function City(cityid,citynm){
        this.cityid=cityid;
        this.citynm=citynm;
        this.townAll = [];
    }
    City.prototype.addTown = function(o){
        this.townAll[this.townAll.length] = o;
  
    }
    //
    function Town(townid,townnm){
        this.townid = townid;
        this.townnm = townnm;
    }
var areaSet = new AreaSet();</script>
<%
set rs=server.CreateObject("adodb.recordset")
sql="select * from bigclass where sort=1"
rs.open sql,conn,1,3
i=1
do while not rs.eof
%>
<script language="javascript"> var area= new Area("<%=i%>","<%=rs("bigclass")%>");</script>
<%
set rs1=server.CreateObject("adodb.recordset")
sql1="select * from bigclass where sort="&rs("id")
rs1.open sql1,conn,1,3
j=i*10+1
‘response.Write(sql1+"<br/>=========================<br>")
do while not rs1.eof
%>
<script language="javascript">var city = new City("<%=j%>","<%=rs1("bigclass")%>");</script>
<%set rs2=server.CreateObject("adodb.recordset")
sql2="select * from bigclass where sort="&rs1("id")
rs2.open sql2,conn,1,3
k=j*10+1
if not (rs2.eof and rs2.bof) then
do while not rs2.eof
%>
<script language="javascript">
                    var town = new Town("<%=k%>","<%=rs2("bigclass")%>");
                city.addTown(town);
                area.addCity(city);
                areaSet.addArea(area);
</script>
<%
k=k+1
rs2.movenext
loop
end if
rs2.close
set rs2=nothing
%>
<%
j=j+1
rs1.movenext
loop
rs1.close
set rs1=nothing
%>
<%
i=i+1
rs.movenext
loop
rs.close
set rs=nothing
conn.close
%>
<script language="javascript">
//?
    function setArea(){
        var pro = document.getElementById("pro");
        for(var i=0;i<areaSet.all.length;i++){
            var area = areaSet.all[i];
            addOption(pro,area.areanm,area.areaid);
        }
    }
    //ó
    function setCity(province){
        var provinceid = province.value;
        var city = document.getElementById("city");
        for(var i=0;i<areaSet.all.length;i++){
            var area = areaSet.all[i];
            if(area.areaid==provinceid){
                removeAllOptions(city);
                for(var j=0;j<area.cityAll.length;j++){
                    addOption(city,area.cityAll[j].citynm,area.cityAll[j].cityid);
                }
                setTown(document.getElementById("city"));
            }

        }
    }

    //
    function setTown(city){
        var cityid = city.value;
        var town = document.getElementById("town");
        for(var i=0;i<areaSet.all.length;i++){
            var area = areaSet.all[i];
            for(var j=0;j<area.cityAll.length;j++){
                var ct = area.cityAll[j];
                if(ct.cityid == cityid){
                    removeAllOptions(town);
                    for(var k=0;k<ct.townAll.length;k++){
                        addOption(town,ct.townAll[k].townnm,ct.townAll[k].townid);
                    }
                }
            }
        }
var oSel_city = document.getElementById("city");
var oSel_pro = document.getElementById("pro");
parent.document.forms[0].fenglei.value=oSel_pro.options[oSel_pro.selectedIndex].text;
parent.document.forms[0].fenglei.value=oSel_pro.options[oSel_pro.selectedIndex].text+"–>"+oSel_city.options[oSel_city.selectedIndex].text;
    }
</script>
<BODY>
<form name="abc">
<table align="center" style="margin:0">
<tr>

   <td>
   <select name="select" size="8" id="pro" style="width:120px" onChange="setCity(this)">
   </select></td>
  
   <td>
    <select size="8" id="city" style="width:120px" onChange="setTown(this)">
    </select>   </td>
  
        <td>
            <select size="8" id="town" style="width:120px" onChange="return bbb()">
            </select>        </td>
</tr>
</table></form>
<script language="javascript">
setArea();
    setCity(document.getElementById("pro"));
    setTown(document.getElementById("city"));
</script>
<script language="javascript">
function bbb(){
var oSel_town = document.getElementById("town");
var oSel_pro2= document.getElementById("pro");
var oSel_city1 = document.getElementById("city");
parent.document.forms[0].fenglei.value=oSel_pro2.options[oSel_pro2.selectedIndex].text+"–>"+oSel_city1.options[oSel_city1.selectedIndex].text+"–>"+oSel_town.options[oSel_town.selectedIndex].text;
}
</script>
效果如图:

三级联动菜单–日期

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title></title>
</head>
      <body>
          <form name="form1">
              <select name="YYYY" onchange="YYYYDD(this.value)">
                <option value="">—选择年—</option>
              </select>
              <select name="MM" onchange="MMDD(this.value)">
                <option value="">—选择月—</option>
              </select>
              <select name="DD">
                <option value="">—选择日—</option>
              </select>
          </form>
          <script language="JavaScript"><!–
              function YYYYMMDDstart()
              {
                  MonHead = [31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31];

                  //先给年下拉框赋内容
                  var y     = new Date().getFullYear();    //返回今年2007
                  for (var i = (y-100); i <y+1; i++) //以今年为准,前100年
                      document.form1.YYYY.options.add(new Option(" "+ i +" 年", i));//给下拉菜单中加如项目

                  //赋月份的下拉框
                  for (var i = 1; i < 13; i++)
                      document.form1.MM.options.add(new Option(" " + i + " 月", i));

                  document.form1.YYYY.value = y;
                  document.form1.MM.value = new Date().getMonth() + 1;
                  var n = MonHead[new Date().getMonth()];
                  if (new Date().getMonth() ==1 && IsPinYear(YYYYvalue)) n++;
                      writeDay(n); //赋日期下拉框
                  document.form1.DD.value = new Date().getDate();
              }
//attachEvent 对于目前的 Opera 也适用。但是问题是 Mozilla/Firefox 并不支持这个方法。但是它支持另一个 addEventListener 方法,这个方法跟
//attachEvent 差不多,也是用来给一个事件指派多个处理过程的。但是它们指派的事件有些区别,在 attachEvent 方法中,事件是以 “on” 开头的,
//而在 addEventListener 中,事件没有开头的 “on”,另外 addEventListener 还有第三个参数,一般这个参数指定为 false 就可以了。
//因此要想在你的程序中给一个事件指派多个处理过程的话,只要首先判断一下浏览器,然后根据不同的浏览器,选择使用 attachEvent
//还是addEventListener 就可以了
              if(document.attachEvent)   
                  window.attachEvent("onload", YYYYMMDDstart);
              else
                  window.addEventListener(‘load’, YYYYMMDDstart, false);
              function YYYYDD(str) //年发生变化时日期发生变化(主要是判断闰平年)
              {                                //document.form1.MM.selectedIndex获取月份值。document.form1.MM.options[document.form1.MM.selectedIndex].value获取月份对应的option传递值
                  var MMvalue = document.form1.MM.options[document.form1.MM.selectedIndex].value;//selectedIndex为月分值.value为月份对应的option value值
                  if (MMvalue == ""){ var e = document.form1.DD; optionsClear(e); return;}
                  var n = MonHead[MMvalue – 1];
                  if (MMvalue ==2 && IsPinYear(str)) n++;
                      writeDay(n)
              }
              function MMDD(str)    //月发生变化时日期联动
              {
                  var YYYYvalue = document.form1.YYYY.options[document.form1.YYYY.selectedIndex].value;
                  if (YYYYvalue == ""){ var e = document.form1.DD; optionsClear(e); return;}
                  var n = MonHead[str – 1];
                  if (str ==2 && IsPinYear(YYYYvalue)) n++;
                      writeDay(n)
              }
              function writeDay(n)    //据条件写日期的下拉框
              {
                  var e = document.form1.DD; optionsClear(e);
                  for (var i=1; i<(n+1); i++)
                      e.options.add(new Option(" "+ i + " 日", i));
              }
              function IsPinYear(year)//判断是否闰平年
              {
                  return(0 == year%4 && (year%100 !=0 || year%400 == 0));
              }
              function optionsClear(e)
              {
                  e.options.length = 1;
              }
      //–>
      </script>
</body>
</html>

三级联动菜单

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE> 三级菜单联动</TITLE>
<META NAME="Generator" CONTENT="EditPlus">
<META NAME="Author" CONTENT="thorn">
<META NAME="Keywords" CONTENT="">
<META NAME="content:encoded" CONTENT="">
</HEAD>
<script language="JavaScript">
//添加option项
    function addOption(objSelectNow,txt,val){
       for(var i=0;i<objSelectNow.length;i++){
           if(objSelectNow.options[i].value==val){
               return false;
           }
       }
       var   objOption   = document.createElement("OPTION");
       objOption.setAttribute("text",txt);
       objOption.setAttribute("value",val);
       objSelectNow.options.add(objOption);
    }
    //删除select所有节点
    function removeAllOptions(selectObject){
        while(selectObject.length>0){
            selectObject.options[0] = null;
        }
    }
//地区集合
    function AreaSet(){
        this.all = [];
    }
    AreaSet.prototype.addArea = function(o){
        this.all[this.all.length] = o;
    }
    //地区
    function Area(areaid,areanm){
        this.areaid = areaid;
        this.areanm= areanm;
        this.cityAll = [];
    }
    Area.prototype.addCity = function(o){
        if(!o) return;
        if(o.cityid == null)return;
        this.cityAll[this.cityAll.length] = o;
    }
    //城市
    function City(cityid,citynm){
        this.cityid=cityid;
        this.citynm=citynm;
        this.townAll = [];
    }
    City.prototype.addTown = function(o){
        this.townAll[this.townAll.length] = o;
    }
    //乡镇
    function Town(townid,townnm){
        this.townid = townid;
        this.townnm = townnm;
    }
var areaSet = new AreaSet();
            var area= new Area("1","河南");
                var city = new City("11","郑州");
                    var town = new Town("111","郑州1乡镇");
                    city.addTown(town);
                    var town = new Town("112","郑州2乡镇");
                    city.addTown(town);
                    var town = new Town("113","郑州3乡镇");
                    city.addTown(town);
                area.addCity(city);
                var city = new City("12","安阳");
                    var town = new Town("121","安阳1乡镇");
                    city.addTown(town);
                    var town = new Town("122","安阳2乡镇");
                    city.addTown(town);
                    var town = new Town("123","安阳3乡镇");
                    city.addTown(town);
                    var town = new Town("124","安阳4乡镇");
                    city.addTown(town);
                area.addCity(city);
                var city = new City("13","新乡");
                    var town = new Town("131","新乡1乡镇");
                    city.addTown(town);
                area.addCity(city);
                var city = new City("14","焦作");
                    var town = new Town("141","焦作1乡镇");
                    city.addTown(town);
                area.addCity(city);
            areaSet.addArea(area);

            var area= new Area("2","河北");
                var city = new City("21","石家庄");
                    var town = new Town("211","石家庄1乡镇");
                    city.addTown(town);
                area.addCity(city);
                var city = new City("22","保定");
                    var town = new Town("221","保定1乡镇");
                    city.addTown(town);
                area.addCity(city);
            areaSet.addArea(area);

            var area= new Area("3","山东");
                var city = new City("31","济南");
                    var town = new Town("311","济南1乡镇");
                    city.addTown(town);
                area.addCity(city);
                var city = new City("32","青岛");
                    var town = new Town("321","青岛1乡镇");
                    city.addTown(town);
                area.addCity(city);
            areaSet.addArea(area);

//设置地区
    function setArea(){
        var pro = document.getElementById("pro");
        for(var i=0;i<areaSet.all.length;i++){
            var area = areaSet.all[i];
            addOption(pro,area.areanm,area.areaid);
        }
    }
    //设置城市
    function setCity(province){
        var provinceid = province.value;
        var city = document.getElementById("city");
        for(var i=0;i<areaSet.all.length;i++){
            var area = areaSet.all[i];
            if(area.areaid==provinceid){
                removeAllOptions(city);
                for(var j=0;j<area.cityAll.length;j++){
                    addOption(city,area.cityAll[j].citynm,area.cityAll[j].cityid);
                }
                setTown(document.getElementById("city"));
            }

        }
    }

    //设置乡镇
    function setTown(city){
        var cityid = city.value;
        var town = document.getElementById("town");
        for(var i=0;i<areaSet.all.length;i++){
            var area = areaSet.all[i];
            for(var j=0;j<area.cityAll.length;j++){
                var ct = area.cityAll[j];
                if(ct.cityid == cityid){
                    removeAllOptions(town);
                    for(var k=0;k<ct.townAll.length;k++){
                        addOption(town,ct.townAll[k].townnm,ct.townAll[k].townid);
                    }
                }
            }
        }
    }
</script>
<BODY>

<table align="center">
<tr>
   <td>省:</td>
   <td>
    <select id="pro" style="width:120px" onchange="setCity(this)">
    </select>
   </td>
   <td>市:</td>
   <td>
    <select id="city" style="width:120px" onchange="setTown(this)">
    </select>
   </td>
   <td>乡:</td>
        <td>
            <select style="width:120px" id="town"></select>
        </td>
</tr>
</table>
<script language="javascript">
setArea();
    setCity(document.getElementById("pro"));
    setTown(document.getElementById("city"));
</script>
</BODY>
</HTML>