ITPub博客
首页 博客 专栏 学院 社区 IT新媒体评选
发博

首页 > Linux操作系统 > Linux操作系统 > 几个不错的js例子

几个不错的js例子

原创 Linux操作系统 作者：aikangyan 时间：2008-03-19 16:33:32 0 删除 编辑
用JavaScript实现的日历
calendar.css:
.cal {
background-color: #ffffff;
}

.head {
color: #bb0000;
font-family: Arial;
font-weight: bold;
text-align: left;
}

.days {
color: #0000bb;
font-family: Arial;
font-weight: bold;
text-align: right;
}

.grey {
color: #ffffff;
font-family: Arial;
font-size: small;
text-align: right;
}

.links {
color: #ff0000;
font-family: Arial;
font-size: small;
text-align: right;
}

.today {
color: #ffffff;
background-color: #ff0000;
font-family: Arial;
font-size: small;
text-align: right;
}

calendar.js:
'January','February','March',
'April','May','June','July',
'August','September','October',
'November','December'
);

var daysOfMonth = new Array(
31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31
);

var daysOfMonthLY = new Array(
31, 29, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31
);

var dow = new Array('Sun','Mon','Tue','Wed','Thu','Fri','Sat',
'Sun','Mon','Tue','Wed','Thu','Fri');

var size = 'width="50" height="30"';
var border = 'border="1"';

function isLeapYear(num) {
if (((num % 4 == 0) && (num % 100 != 0)) || (num % 400 == 0))
return true;
return false;
}

function CalendarSelect(Month,Year, offset) {
if (offset == null) ffset = 0;

if (window.changeMonth) { }
else {
alert('A changeMonth() function has not been defined');
return '';
}

if (window.changeYear) { }
else {
alert('A changeYear() function has not been defined');
return '';
}

if (window.changeDay) { }
else {
alert('A changeDay() function has not been defined');
return '';
}

var utput = '';

output += '';
output += CalendarHead(Month,Year,true);
output += CalendarMonth(Month,Year,offset);
output += '';

return output;
}

function CalendarHead(Month,Year,Select) {
var utput = '';

output +=
'

' +
'';

if (Select) {

output += '

' +
moy[Month-1] + ' ' + Year +
'		' +
'' +
'';
}

output += '

';

return output;
}

function CalendarMonth(M,Y,offset) {
M--;
if (offset == null) ffset = 0;

firstDay = new Date(Y,M,1);
startDay = firstDay.getDay();

if (startDay < offset) startDay += 7;

var days = daysOfMonth;
if (isLeapYear(Y)) days = daysOfMonthLY;

var utput = '';

output +=
'

';

for (var i=0; i<7; i++)
output += '

';

output += '

';

var column = 0;
var lastM = M - 1;
if (lastM == -1) lastM = 11;

for (var i=0+offset; ioutput += '

';

for (var i=1; i<=days[M]; i++, column++) {
var style. = ' class="links"';
if (day == i && month == M+1 && year == Y)
style. = ' class="today"';
if (window.changeDay)
output += '

';
else
output += '';

if (column == 6) {
output += '

';
column = -1;
}
}

if (column > 0) {
for (var i=1; column<7; i++, column++)
output += '

';
}

output += '

' +
dow[i + offset] + '
' +
(days[lastM]-startDay+i+1) + '		' +
'style. + '>' + i + '		' + i + '
' + i + '
';

return output;
}

function getAnOptionValue(what) {
return what.options[what.options.selectedIndex].value;
}

function CalMonth() {
CalendarMonth = getAnOptionValue(document.Cal.Month) - 0;
changeMonth(CalendarMonth);
}

function CalYear() {
CalendarYear = getAnOptionValue(document.Cal.Year) - 0;
changeYear(CalendarYear);
}

function CalDay(day,month,year) {
CalendarDay = day;
CalendarMonth = month;
CalendarYear = year;
changeDay(CalendarDay,CalendarMonth,CalendarYear);
}

var CalendarMonth;
var CalendarYear;
var CalendarDay;


current.js:
function getFullYear() {
var year = this.getYear();
if (year < 1000) year += 1900;
return year;
}

if (!Date.getFullYear)
Date.prototype.getFullYear = getFullYear;

function getMilliseconds() {
var date = new Date(
this.getFullYear(), this.getMonth(), this.getDate(),
this.getHours(), this.getMinutes(), this.getSeconds(), 0
);
return this.getTime() - date.getTime();
}

if (!Date.getMilliseconds)
Date.prototype.getMilliseconds = getMilliseconds;

var daysOfWeek = new Array(
'Sunday','Monday','Tuesday','Wednesday',
'Thursday','Friday','Saturday'
);

var monthsOfYear = new Array(
'January','February','March','April','May','June',
'July','August','September','October','November','December'
);

function y2k(number) {
number = number - 0;
return (number < 1000) ? number + 1900 : number;
}

function dayOfWeek(day,month,year) {
var a = Math.floor((14 - month)/12);
var y = year - a;
var m = month + 12*a - 2;
var d = (day + y + Math.floor(y/4) - Math.floor(y/100) +
Math.floor(y/400) + Math.floor((31*m)/12)) % 7;
return d;
}

function nths(day) {
if (day == 1 || day == 21 || day == 31) return 'st';
if (day == 2 || day == 22) return 'nd';
if (day == 3 || day == 23) return 'rd';
return 'th';
}

function formatFullDate(day,month,year) {
var dow = dayOfWeek(day,month,year);
return daysOfWeek[dow] + ' ' +
day + nths(day) + ' ' +
monthsOfYear[month-1] +' '+ year;
}

function padout(num) {
return (num < 10) ? '0' + num : num;
}

function formatShortDate(day,month,year) {
return padout(day) + '/' + padout(month) + '/' + year;
}

function formatShortDateUS(day,month,year) {
return padout(month) + '/' + padout(day) + '/' + year;
}


index.htm:

Calendar


<!--
size = '';
border = 'border="0"';
dow = new Array('S','M','T','W','T','F','S',
'S','M','T','W','T','F');
moy = new Array(
'Jan','Feb','Mar','Apr','May','Jun',
'Jul','Aug','Sep','Oct','Nov','Dec'
);

function changeDay(day, month, year) {
alert(new Date(year, month, day));
}

var utput = '';

if (window.formatFullDate && window.CalendarSelect) {
var today = new Date();
var day = today.getDate();
var month = today.getMonth() + 1;
var year = today.getFullYear();

output +=
'

';

for (var i = 1; i <= 12; i++) {
output += '

' +
CalendarHead(i,year) +
CalendarMonth(i,year,1) +
'
';

if (i != 12) {
if (i % 3 == 0)
output += '

';
else
output += '		';
}
}

output += '

';
}

document.write(output);
//-->

把这四个文件放在同一目录下。运行index.htm

Posted by kevinwu 10:16 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

javaScript小日历




日期选择 - BY ziyue

// 日期选择
// By Ziyue(http://www.web-v.com/)
var months = new Array("一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月");
var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var days = new Array("日","一", "二", "三", "四", "五", "六");
var today;

document.writeln("

");

function getDays(month, year)
{
    //下面的这段代码是判断当前是否是闰年的
    if (1 == month)
        return ((0 == year % 4) && (0 != (year % 100))) || (0 == year % 400) ? 29 : 28;
    else
        return daysInMonth[month];
}

function getToday()
{
    //得到今天的年,月,日
    this.now = new Date();
    this.year = this.now.getFullYear();
    this.month = this.now.getMonth();
    this.day = this.now.getDate();
}

function getStringDay(str)
{
    //得到输入框的年,月,日
    var str=str.split("-")
   
    this.now = new Date(parseFloat(str[0]),parseFloat(str[1])-1,parseFloat(str[2]));
    this.year = this.now.getFullYear();
    this.month = this.now.getMonth();
    this.day = this.now.getDate();
}

function newCalendar() {
    var parseYear = parseInt(document.all.Year.options[document.all.Year.selectedIndex].value);
    var newCal = new Date(parseYear, document.all.Month.selectedIndex, 1);
    var day = -1;
    var startDay = newCal.getDay();
    var daily = 0;
   
    if ((today.year == newCal.getFullYear()) &&(today.month == newCal.getMonth()))
        day = today.day;
       
    var tableCal = document.all.calendar;
    var intDaysInMonth =getDays(newCal.getMonth(), newCal.getFullYear());
    
    for (var intWeek = 1; intWeek < tableCal.rows.length;intWeek++)
        for (var intDay = 0;intDay < tableCal.rows[intWeek].cells.length;intDay++)
        {
            var cell = tableCal.rows[intWeek].cells[intDay];
            if ((intDay == startDay) && (0 == daily))
                daily = 1;
               
            if(day==daily) //今天，调用今天的Class
            {
                cell.style.background='#6699CC';
                cell.style.color='#FFFFFF';
                //cell.style.fontWeight='bold';
            }
            else if(intDay==6) //周六
                cell.style.color='green';
            else if (intDay==0) //周日
                cell.style.color='red';
           
            if ((daily > 0) && (daily <= intDaysInMonth))
            {
                cell.innerText = daily;
                daily++;
            }
            else
                cell.innerText = "";
        }
}

function GetDate(InputBox)
{
    var sDate;
    //这段代码处理鼠标点击的情况
    if (event.srcElement.tagName == "TD")
        if (event.srcElement.innerText != "")
        {
            sDate = document.all.Year.value + "-" + document.all.Month.value + "-" + event.srcElement.innerText;
            eval("document.all."+InputBox).value=sDate;
            HiddenCalendar();
        }
}

function HiddenCalendar()
{
    //关闭选择窗口
    document.all.Calendar.style.visibility='hidden';
}

function ShowCalendar(InputBox)
{
    var x,y,intLoop,intWeeks,intDays;
    var DivContent;
    var year,month,day;
    var o=eval("document.all."+InputBox);
    var thisyear; //真正的今年年份
   
    thisyear=new getToday();
    thisyear=thisyear.year;
   
    today = o.value;
    if(isDate(today))
        today = new getStringDay(today);
    else
        today = new getToday();
   
    //显示的位置
    x=o.offsetLeft;
    y=o.offsetTop;
    while(o=o.offsetParent)
    {
        x+=o.offsetLeft;
        y+=o.offsetTop;
    }
    document.all.Calendar.style.left=x+2;
    document.all.Calendar.style.top=y+20;
    document.all.Calendar.style.visibility="visible";
   
    //下面开始输出日历表格(border-color:#9DBAF7)
    DivContent="

";
    DivContent+="";
    DivContent+="";
   
    DivContent+="";
    DivContent+="";
    
    DivContent+="
";
   
    //年
    DivContent+="";
   
    //月
    DivContent+="";
   
    DivContent+="		S
";
    DivContent+="";
   
    //星期
    DivContent+="";
    for (intLoop = 0; intLoop < days.length; intLoop++)
        DivContent+="";
    DivContent+="";
   
    //天
    for (intWeeks = 0; intWeeks < 6; intWeeks++)
    {
        DivContent+="";
        for (intDays = 0; intDays < days.length; intDays++)
            DivContent+="";
        DivContent+="";
    }
    DivContent+="
" + days[intLoop] + "
";

    document.all.Calendar.innerHTML=DivContent;
    newCalendar();
}

function isDate(dateStr)
{
    var datePat = /^(\d{4})(\-)(\d{1,2})(\-)(\d{1,2})$/;
    var matchArray = dateStr.match(datePat);
    if (matchArray == null) return false;
    var month = matchArray[3];
    var day = matchArray[5];
    var year = matchArray[1];
    if (month < 1 || month > 12) return false;
    if (day < 1 || day > 31) return false;
    if ((month==4 || month==6 || month==9 || month==11) && day==31) return false;
    if (month == 2)
    {
        var isleap = (year % 4 == 0 && (year % 100 != 0 || year % 400 == 0));
        if (day > 29 || (day==29 && !isleap)) return false;
    }
    return true;
}


<!--
td,input {
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 12px;
}
-->



   


     
         
         
          
     
选择日期：
             		BLOG:Http://Blog.CSDN.Net/AppleBBS">Http://Blog.CSDN.Net/AppleBBS>
     



Posted by kevinwu 10:14 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

一个JavaScript的日历


  var months = new Array("一", "二", "三","四", "五", "六", "七", "八", "九","十", "十一", "十二");

 

  var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31,30, 31, 30, 31);

 

  var days = new Array("日","一", "二", "三","四", "五", "六");

 

  var classTemp;

 

  var today=new getToday();

 

  var year=today.year;

 

  var month=today.month;

 

  var newCal;

 

  function getDays(month, year) {

 

  if (1 == month) return ((0 == year % 4) && (0 != (year % 100))) ||(0 == year % 400) ? 29 : 28;

 

  else return daysInMonth[month];

 

  }

 

  function getToday() {

 

  this.now = new Date();

 

  this.year = this.now.getFullYear();

 

  this.month = this.now.getMonth();

 

  this.day = this.now.getDate();

 

  }

 

  function Calendar() {

 

  newCal = new Date(year,month,1);

 

  today = new getToday();

 

  var day = -1;

 

  var startDay = newCal.getDay();

 

  var endDay=getDays(newCal.getMonth(), newCal.getFullYear());

 

  var daily = 0;

 

  if ((today.year == newCal.getFullYear()) &&(today.month == newCal.getMonth()))

 

  {

 

  day = today.day;

 

  }

 

  var caltable = document.all.caltable.tBodies.calendar;

 

  var intDaysInMonth =getDays(newCal.getMonth(), newCal.getFullYear());

 

  for (var intWeek = 0; intWeek < caltable.rows.length;intWeek++)

 

  for (var intDay = 0;intDay < caltable.rows[intWeek].cells.length;intDay++)

 

  {

 

  var cell = caltable.rows[intWeek].cells[intDay];

 

  var montemp=(newCal.getMonth()+1)<10?("0"+(newCal.getMonth()+1)):(newCal.getMonth()+1);

 

  if ((intDay == startDay) && (0 == daily)){ daily = 1;}

 

  var daytemp=daily<10?("0"+daily):(daily);

 

  var d="<"+newCal.getFullYear()+"-"+montemp+"-"+daytemp+">";

 

  if(day==daily) cell.className="DayNow";

 

  else if(intDay==6) cell.className = "DaySat";

 

  else if (intDay==0) cell.className ="DaySun";

 

  else cell.className="Day";

 

  if ((daily > 0) && (daily <= intDaysInMonth))

 

  {

 

  cell.innerText = daily;

 

  daily++;

 

  } else

 

  {

 

  cell.className="CalendarTD";

 

  cell.innerText = "";

 

  }

 

  }

 

  document.all.year.value=year;

 

  document.all.month.value=month+1;

 

  }

 

  function subMonth()

 

  {

 

  if ((month-1)<0)

 

  {

 

  month=11;

 

  year=year-1;

 

  } else

 

  {

 

  month=month-1;

 

  }

 

  Calendar();

 

  }

 

  function addMonth()

 

  {

 

  if((month+1)>11)

 

  {

 

  month=0;

 

  year=year+1;

 

  } else

 

  {

 

  month=month+1;

 

  }

 

  Calendar();

 

  }

 

  function setDate()

 

  {

 

  if (document.all.month.value<1||document.all.month.value>12)

 

  {

 

  alert("月的有效范围在1-12之间!");

 

  return;

 

  }

 

  year=Math.ceil(document.all.year.value);

 

  month=Math.ceil(document.all.month.value-1);

 

  Calendar();

 

  }

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

  document.write("

");

 

  for (var intLoop = 1; intLoop < days.length-1;intLoop++)

 

  document.write("

");

 

  document.write("

");

 

 

 

 

 

 

 

 

 

 

 

  for (var intWeeks = 0; intWeeks < 6; intWeeks++)

 

  {

 

  document.write("

");

 

  for (var intDays = 0; intDays < days.length;intDays++) document.write("

");

 

  document.write("

");

 

  }

 

 

 

 

 

 

 

  3 年 月 4

 

 

" + days[0] + "" + days[intLoop] + "" + days[intLoop] + "

 

 

 

  Calendar();

 

 


Posted by kevinwu 10:12 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

javascript实现日历式日期选择




Canlender--JavaScript








function RunNian(The_Year)
{
 if ((The_Year%400==0) || ((The_Year%4==0) && (The_Year%100!=0)))
  return true;
 else
  return false;
}
function GetWeekday(The_Year,The_Month)
{
 
 var Allday;
 Allday = 0;
 if (The_Year>2000)
 {
 
  for (i=2000 ;i   if (RunNian(i))
    Allday += 366;
   else
    Allday += 365;
  for (i=2; i<=The_Month; i++)
  {
   switch (i)
   {
    case 2 :
     if (RunNian(The_Year))
      Allday += 29;
     else
      Allday += 28;
     break;
    case 3 : Allday += 31; break;
    case 4 : Allday += 30; break;
    case 5 : Allday += 31; break;
    case 6 : Allday += 30; break;
    case 7 : Allday += 31; break;
    case 8 : Allday += 31; break;
    case 9 : Allday += 30; break;
    case 10 : Allday += 31; break;
    case 11 : Allday += 30; break;
    case 12 :  Allday += 31; break;
   
   }
  
  }
 }
 
 return (Allday+6)%7;
 

}

function chooseday(The_Year,The_Month,The_Day)
{
 var Firstday;
 var completely_date;
 if (The_Day!=0)
  completely_date = The_Year + "-" + The_Month + "-" + The_Day;
 else
  completely_date = "No Choose";
 //showdate 只是一个为了显示而采用的东西，
 //如果外部想引用这里的时间，可以通过使用 completely_date引用完整日期
 //也可以通过The_Year,The_Month,The_Day分别引用年，月，日
 //当进行月份和年份的选择时，认为没有选择完整的日期
 showdate.innerText = completely_date;
 Firstday = GetWeekday(The_Year,The_Month);
 ShowCalender(The_Year,The_Month,The_Day,Firstday);
 
}

function nextmonth(The_Year,The_Month)
{
 if (The_Month==12)
  chooseday(The_Year+1,1,0);
 else
  chooseday(The_Year,The_Month+1,0);
}

function prevmonth(The_Year,The_Month)
{
 if (The_Month==1)
  chooseday(The_Year-1,12,0);
 else
  chooseday(The_Year,The_Month-1,0);
}

function prevyear(The_Year,The_Month)
{
 chooseday(The_Year-1,The_Month,0);
}

function nextyear(The_Year,The_Month)
{
 chooseday(The_Year+1,The_Month,0);
}

 

 

function ShowCalender(The_Year,The_Month,The_Day,Firstday)
{

 var showstr;
 var Month_Day;
 var ShowMonth;
 var today;
 today = new Date();
 
 
 
 switch (The_Month)
 {
  case 1 : ShowMonth = "January"; Month_Day = 31; break;
  case 2 :
   ShowMonth = "February";
   if (RunNian(The_Year))
    Month_Day = 29;
   else
    Month_Day = 28;
   break;
  case 3 : ShowMonth = "March"; Month_Day = 31; break;
  case 4 : ShowMonth = "April"; Month_Day = 30; break;
  case 5 : ShowMonth = "May"; Month_Day = 31; break;
  case 6 : ShowMonth = "June"; Month_Day = 30; break;
  case 7 : ShowMonth = "July"; Month_Day = 31; break;
  case 8 : ShowMonth = "August"; Month_Day = 31; break;
  case 9 : ShowMonth = "September"; Month_Day = 30; break;
  case 10 : ShowMonth = "October"; Month_Day = 31; break;
  case 11 : ShowMonth = "November"; Month_Day = 30; break;
  case 12 : ShowMonth = "December"; Month_Day = 31; break;
  
 }
 
 
 showstr = "";
 showstr = "

";
 showstr +=  "";
 showstr +=  "
<< " + The_Year + " >><<" + ShowMonth + ">>
";
 showstr +=  "";
 showstr += " ";
    showstr += "";
    showstr += "";
    showstr += "";
    showstr += "";
    showstr += "";
    showstr += "";
    showstr += "";
 showstr += "";
 
 for (i=1; i<=Firstday; i++)
  showstr += "";
 
 for (i=1; i<=Month_Day; i++)
 {
  if ((The_Year==today.getYear()) && (The_Month==today.getMonth()+1) && (i==today.getDate()))
   bgColor = "#FFCCCC";
  else
   bgColor = "#CCCCCC";
 
  if (The_Day==i) bgColor = "#FFFFCC";
  showstr += "";
  Firstday = (Firstday + 1)%7;
  if ((Firstday==0) && (i!=Month_Day)) showstr += "";
 }
 if (Firstday!=0)
 {
  for (i=Firstday; i<7; i++)
   showstr += "";
  showstr += "";
 }
 
 showstr += "
日一二三四五六
 " + i + "
 
";
 cc.innerHTML = showstr; 
 

}


 var The_Year,The_Day,The_Month;
 var today;
 var Firstday;
 today = new Date();
 The_Year = today.getYear();
 The_Month = today.getMonth() + 1;
 The_Day = today.getDate();
 Firstday = GetWeekday(The_Year,The_Month);
 ShowCalender(The_Year,The_Month,The_Day,Firstday);



Posted by kevinwu 10:11 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

November 25, 2006
用JavaScript实现UrlEncode和UrlDecode
1、



/*利用VBScript构建asc吗和字符串的互转函数*/
Function str2asc(strstr)
 str2asc = hex(asc(strstr))
End Function
Function asc2str(ascasc)
 asc2str = chr(ascasc)
End Function



/*这里开始时UrlEncode和UrlDecode函数*/
function UrlEncode(str){
  var ret="";
  var strSpecial="!"#$%&'()*+,/:;<=>?[]^`{|}~%";
  for(var i=0;i   var chr = str.charAt(i);
    var c=str2asc(chr);
    tt += chr+":"+c+"n";
    if(parseInt("0x"+c) > 0x7f){
      ret+="%"+c.slice(0,2)+"%"+c.slice(-2);
    }else{
      if(chr==" ")
        ret+="+";
      else if(strSpecial.indexOf(chr)!=-1)
        ret+="%"+c.toString(16);
      else
        ret+=chr;
    }
  }
  return ret;
}
function UrlDecode(str){
  var ret="";
  for(var i=0;i   var chr = str.charAt(i);
    if(chr == "+"){
      ret+=" ";
    }else if(chr=="%"){
     var asc = str.substring(i+1,i+3);
     if(parseInt("0x"+asc)>0x7f){
      ret+=asc2str(parseInt("0x"+asc+str.substring(i+4,i+6)));
      i+=5;
     }else{
      ret+=asc2str(parseInt("0x"+asc));
      i+=2;
     }
    }else{
      ret+= chr;
    }
  }
  return ret;
}

2、

function urlencode(str)
tmp=""
strSpecial="_-.1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ"
for i=1 to len(str)
  crt=mid(str,i,1)
  if instr(1,strSpecial,crt,1) then  
   tmp=tmp&crt  
  else
   hexc=hex(asc(crt))
   tmp=tmp&"%"& mid(hexc,1,2)
   if len(hexc)>2 then
    tmp=tmp&"%"& mid(hexc,3,2)
   end if
  end if  
next
urlencode=tmp
end function


3、

function urlencode(vstrin)
    dim i,strreturn,strSpecial
    strSpecial = " <>""#%{}|^~[]`'&?+"
    strreturn = ""
    for i = 1 to len(vstrin)
        thischr = mid(vstrin,i,1)
        if abs(asc(thischr)) < &hff then
            if instr(strSpecial,thischr)>0 then
                strreturn = strreturn & "%" & hex(asc(thischr))
            else
                strreturn = strreturn & thischr
            end if
        else
            innercode = asc(thischr)
            if innercode < 0 then
                innercode = innercode + &h10000
            end if
            hight8 = innercode '(innercode  and &hff00)' mod &hff
            low8 = innercode and &hff
            strreturn = strreturn & "%" & hex(hight8) &  "%" & hex(low8)
        end if
    next
    urlencoding = strreturn
end function
document.write(urlencode("中文 <>""#%{}|^~[]`'&?+Abc")+"
")

Posted by kevinwu 11:52 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

通过时间校验学习JavaScript正则表达式
   为什么要从时间验证的例子开始我们的正则表达之旅呢？首先，因为时间校验比较常用，尤其是日期的验证几乎是每个注册程序都要进行校验的；另外，日期函数相 对来说包含的涉及正则表达式的内容较少，其次字符单一除了数字之外，就是几个很有限的连接连接符号，正则逻辑简单。


    预备知识：
    1.为JavaScript增加函数：熟悉Java的人都是知道，Java所有的方法都是封装在类中的，那么JavaScript实际上类似（注意：我并 没有讨论JavaScript和Java的相关性，只是说道他们的相似性）；JavaScript中所有的字符串操作实际上都是在String这个类中， 那么我们要为字符串增加一个日期校验的函数应该来怎么做呢？
     类名.prototype.方法名 = function (){
        /*语句块*/
     }
     比如我们为字符创类增加一个日期校验的方法IsDate：
     String.prototype.IsDate=function(){
     }
     那么问题来了，这个字符串本身用什么来代表呢？数字面向对象的朋友很快就会想到this，对了就是它；


     2.正则表达式的基本知识：
        /  标识正则表达式的开始位置和基础位置
        ^  表示字符串的开始位置
        $  表示字符串的结束位置
        |  或者
        -  描述该字符串的是由（-）左右连个字符之间的所有字符构成
        {n,m}有n到m个字符串组成

     下面我们就开始日期校验函数的编写
      首先我们分析一个完整日期的构成，比如2005-9-13
      ?年份是后4位数字构成
      ?月份是由1-12的数字构成
      ?日期是由1-31的数字构成
      ?年份可以被四整除为闰年
      ?2月的闰年为29天，否则为28天
      ?1、3、5、7、8、10、12每个月的为31天
      ?4、6、9、11每个月为30天
      ?如果日期或月份为各位数，那么十位也可以加上0

      以上为我们分析的结果，那么根据我们的分析，我们先来构造自己的算法或者说方法。}

      年份：能被四整除的了，那么能被4整除的数字都什么特征呢？这是个数学问题了，如果你想不出来，可以再去翻一翻小学的数学书。这里我可以个告诉你以为十位 数为0、2、4、6、8个位为0、4、8以及十位是1、3、5、7、9各位是26可以被四整除。前两位是由0到9的两位数字组成[0-9]{2},后两位 闰年[02468][048]或者是[13579][26]，完整闰年就是将这些都连起来([0-9]{2}([02468][048])| ([13579][26]))那么非闰年呢？所有不能被4整除的就是，也就是把闰年的后两位反过来

      月份：接下来我们来从最特殊的入手，也就是2月，而其他的月份则与是否闰年无关先来看一下闰年的2月；2月的写法可以使2也可以是02，在正则里应该是 [0]{0，1}[2]或者你也可以(2|02)；还有大月(([0]{0,1}(1|3|5|7|8))|(10|12)、小月(([0]{0,1} (4|6))|11)

      日期：2月闰年是1到29天，非闰年是1到28天，从正则来考虑，十位是0到2，各位是0到8或0到9组成,闰年：([0][1-9])|([1-2] [0-9]，非闰年([0][1-9])|([1][0-9])|([2][0-8])，大月([0][1-9])|([1-2][0-9]) |30|31小月([0][1-9])|([1-2][0-9])|30

     至此，我们的零部件已经制作完成，接下就是我们的组装过程，完整日期的合法性是怎么样子的呢？
     闰年-2月-闰2月的的日期
     或者
     非闰年-2月-非闰2月的的日期
     或者
     年份-大月-大月日期
     或者
     年份-小月-小月日期

润2月完整日期：(([0-9]{2}([02468][048])|([13579][26])))(-)(2|02)(-)(([0][1-9])|([1-2][0-9]))
非润2月完整日期：(([0-9]{2}([02468][123579])|([13579][01345789])))(-)(2|02)(-)(([0][1-9])|([1][0-9])([2][0-8]))
大月完整日期：([0-9]{4})(-)((([0]{0,1}(1|3|5|7|8))|(10|12))(-)(([0][1-9])|([1-2][0-9])|30|31)
小月完整日期：([0-9]{4})(-)((([0]{0,1}(4|6))|11))(-)(([0][1-9])|([1-2][0-9])|30)

     到这里我们的日期校验函数基本算是完工了，唯一要做的就是收尾工作了，把四个完整日期正则用|（或者）连起来，并且把它写到我们为String新增的函数中就算完工了：
   String.prototype.IsDate=function(){
    var regexp = /^((([0-9]{2}([02468][048])|([13579][26])))(-)(2|02)(-)(([0][1-9])|([1-2][0-9])))|((([0-9]{2}([02468][123579])|([13579][01345789])))(-)(2|02)(-)(([0][1-9])|([1][0-9])([2][0-8])))|(([0-9]{4})(-)((([0]{0,1}(1|3|5|7|8))|(10|12))(-)(([0][1-9])|([1-2][0-9])|30|31))|(([0-9]{4})(-)((([0]{0,1}(4|6))|11))(-)(([0][1-9])|([1-2][0-9])|30))$/g;
    return regexp.test(this);
  }
    从现在开始我们就是这样来判断一个字符串是否为一个合法的日期了：
     var strDate ="2005-2-29";
     if(strDate.IsDate())
       alert("这是一个正确的日期格式");
     else
       alert("日期格式错误");


Posted by kevinwu 11:51 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

js二级下拉列表


二级别下拉列表

<!--
/*
// +----------------------------------------------------------------------+
// | 无限级下拉列表 Version:dOption 0.1                                  |
// +----------------------------------------------------------------------+
// | Authors:   Moocky Mark                                                    |
*/
function c(s,i){this.s=s;this.i=i;}
function p(value,text){this.value=value;this.text=text;}
var where = new Array(4);
where[0]= new c(new p("wenxue","心情文学"),
        new Array(new p("topic","标题"),
             new p("user","作者"),
             new p("all","全文")));
where[1]= new c(new p("enjoy","文学鉴赏"),
        new Array(new p("topic","标题"),
             new p("litterateur","文人"),
             new p("all","全文")));
where[2]= new c(new p("forum","文学论坛"),
        new Array(new p("topic","标题"),
             new p("user","作者"),
             new p("all","全文")));
where[3]= new c(new p("news","站内新闻"),
        new Array(new p("topic","标题"),
             new p("all","全文")));
function loadSelect(){
 with(document.getElementById("sel1")){
  length = where.length;
  for(var i=0;i< where.length;i++){
   var p=where[i].s;
   options[i].value = p.value;
   options[i].text  = p.text;
  }
  nchange=Function("chgSelect();");
 }
 chgSelect();
}

function chgSelect(){
 with(document.getElementById("sel1")){
  for(var i=0; i < where.length ; i++){
   if(options[selectedIndex].value==where[i].s.value)
    var p = where[i].i;
  }
 }
 
 with(document.getElementById("sel2")){
  length = p.length;
  for(i=0;i < p.length;i++){
   options[i].value = p[i].value;
   options[i].text  = p[i].text;
  }
 }
}
//-->




 
   
   
 
 
   
   
 
 
   
   
 
 
   
 

关键词：
栏　目：
字　段：
   


loadSelect();


Posted by kevinwu 11:51 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

超爽无限级下拉列表
if($_SERVER['REQUEST_METHOD']=='POST'){
 print_r($_POST);
}
?>



n级别下来列表


<!--
/*
// +----------------------------------------------------------------------+
// | 无限级下拉列表 Version:dOption 0.1                                  |
// +----------------------------------------------------------------------+
// | Authors:   Moocky Mark                                                    |
// +----------------------------------------------------------------------+
// | LastUpdate:2006-07-19                                                  |
// +----------------------------------------------------------------------+
// | 请尊重作者的劳动成果，保留版权信息                                     |
// +----------------------------------------------------------------------+
*/
var d = new dOption('d');
d.add(1,0,'text_1_0_0_0_1','value_1_0_0_0_1');
d.add(2,1,'text_1_1_0_0_1','value_1_1_0_0_1');
d.add(3,1,'text_1_2_0_0_1','value_1_2_0_0_1');
d.add(4,1,'text_1_3_0_0_1','value_1_3_0_0_1');
d.add(5,2,'text_1_1_1_0_1','value_1_1_1_0_1');
d.add(6,2,'text_1_1_2_0_1','value_1_1_2_0_1');
d.add(7,2,'text_1_1_3_0_1','value_1_1_3_0_1');
d.add(8,6,'text_1_1_2_1_1','value_1_1_2_1_1');
d.add(9,6,'text_1_1_2_2_1','value_1_1_2_2_1');
d.add(10,6,'text_1_1_2_3_1','value_1_1_2_3_1');
d.add(11,0,'text_2_0_0_0_1','value_2_0_0_0_1');
d.add(12,11,'text_2_1_0_0_1','value_2_1_0_0_1');
d.add(13,11,'text_2_2_0_0_1','value_2_2_0_0_1');
d.add(14,11,'text_2_3_0_0_1','value_2_3_0_0_1');
d.add(15,12,'text_2_1_1_0_1','value_2_1_1_0_1');
d.add(16,12,'text_2_1_2_0_1','value_2_1_2_0_1');
d.add(17,12,'text_2_1_3_0_1','value_2_1_3_0_1');
d.add(18,16,'text_2_1_2_1_1','value_2_1_2_1_1');
d.add(19,16,'text_2_1_2_2_1','value_2_1_2_2_1');
d.add(20,16,'text_2_1_2_3_1','value_2_1_2_3_1');

function c(t){
 var nodes = d.nodes;
 var groups = d.groups;
 var inputName = parseInt(t.name.substring(t.name.indexOf('[')+1,t.name.indexOf(']')))+1;
 try{
  for(var i = inputName ; i < groups.length ; i++ ){
   //alert(i);
   d.delSelectElement(i);
  }
 }catch(e){
 }
 for(el in nodes){
  if(nodes[el].value==t.options[t.selectedIndex].value){
   var bj = null;
   /*判断selecet对象是否存在*/
   try{
    bj = document.getElementById(d.config.selectId+'_'+inputName).name;
   }catch(e){
   }
   if(groups[nodes[el].id]){
    if(obj==null)
     d.createSelectElement(inputName);
 
    d.parseDTree(nodes[el].id,inputName);
   }
  }
 }
}
//-->











Posted by kevinwu 11:40 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

如何禁止在文本框中输入中文
具体步骤：

方法一：用文本框的CSS属性ime-mode实现。

   

 提示：设置ime-mode为disabled的意思是禁止在输入时禁止用户激活输入中文，韩文，日文等的输入法（IME）状态，因为这个只能检测到键盘的输入，对通过鼠标操作的粘贴和拖放无效。

方法二：在松开按键时用脚本检查文本框的值，只保留Unicode编码在0和255之间的字符。



方法三：把所有双字节字符替换为空。


    
方法四：把中文字符替换为空。

特别提示
本例代码运行后，第一种方法是不能切换输入法，所以无法输入中文，其它三种方法是在输入中文后立即被替换为空，同时禁止了粘贴和拖放事件。

 

特别说明


本例主要是css属性ime-mode和对中文或双字节字符的判断应用。
ime-mode 设置输入方法编辑器(IME)的状态。
charCodeAt返回指定位置上字符的 Unicode 编码值。

Posted by kevinwu 11:25 AM | 全文 | 引用 (0) | JAVASCRIPT(37)

November 23, 2006
滑动展开/收缩广告代码实例效果
功能说明:
滑动展开/收缩广告效果,可指定：广告完全展开时的停留时间，最大高度

兼容浏览器：
IE5.0+、FF1.06+、Opera8.0+

实例代码：

http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
http://www.w3.org/1999/xhtml" lang="gb2312">

代码实例：滑动展开/收缩广告




var intervalId = null;
function slideAd(id,nStayTime,sState,nMaxHth,nMinHth){
  this.stayTime=nStayTime*1000 || 3000;
  this.maxHeigth=nMaxHth || 90;
  this.minHeigth=nMinHth || 1;
  this.state=sState || "down" ;
  var bj = document.getElementById(id);
  if(intervalId != null)window.clearInterval(intervalId);
  function openBox(){
   var h = obj.offsetHeight;
   obj.style.height = ((this.state == "down") ? (h + 2) : (h - 2))+"px";
    if(obj.offsetHeight>this.maxHeigth){
    window.clearInterval(intervalId);
    intervalId=window.setInterval(closeBox,this.stayTime);
    }
    if (obj.offsetHeight    window.clearInterval(intervalId);
    obj.style.display="none";
    }
  }
  function closeBox(){
   slideAd(id,this.stayTime,"up",nMaxHth,nMinHth);
  }
  intervalId = window.setInterval(openBox,10);
}





     
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容

    •  
  • 这里是广告内内容



代码实例：滑动展开/收缩广告   请刷新页面，再次观看演示效果



 <!--
 slideAd('MyMoveAd',2);
-->


继续阅读 "滑动展开/收缩广告代码实例效果" ?

Posted by kevinwu 07:13 PM | 全文 | 引用 (0) | JAVASCRIPT(37)

November 10, 2006
在查询页面中显示进度条，在数据load成功后隐去进度条

function onSubmit() {
  var waitingInfo = document．getElementById(getNetuiTagName("waitingInfo"));
  waitingInfo.style.display = ""; //show the ProgressBar
  progress_update();&

来自 “ ITPUB博客 ” ，链接：https://blog.itpub.net/12379366/viewspace-211691/ ，如需转载，请注明出处，否则将追究法律责任。

0
0
上一篇： js代码大全
下一篇： color
请登录后发表评论 登录
全部评论
aikangyan

注册时间：2007-12-12

  • 博文量
    81
  • 访问量
    54559

最新文章

支持我们 作者招募 用户协议 FAQ Contact Us

北京盛拓优讯信息技术有限公司. 版权所有  京ICP备16024965号-8 北京市公安局海淀分局网监中心备案编号：11010802021510 niuxiaotong@pcpop.com 17352615567 未成年人举报专区

广播电视节目制作经营许可证(京) 字第1234号 中国互联网协会会员

违法和不良信息举报电话:18101376593