JavaScript实例技巧精选(12)—计算星座与属相

>>点击这里下载完整html源码<<

这是截图:

核心代码如下：

 1  <SCRIPT LANGUAGE="JavaScript">

 2 <!-- Begin

 3 function signs() {

 4 var start = 1901, birthyear = document.zodiac.year.value, date=document.zodiac.date.value, month=document.zodiac.month.selectedIndex;

 5 

 6 with (document.zodiac.sign){

 7 

 8 if (month == 1 && date >=20 || month == 2 && date <=18) {value = "水瓶座";}

 9 if (month == 1 && date > 31) {value = "Huh?";}

10 if (month == 2 && date >=19 || month == 3 && date <=20) {value = "双鱼座";}

11 if (month == 2 && date > 29) {value = "Say what?";}

12 if (month == 3 && date >=21 || month == 4 && date <=19) {value = "白羊座";}

13 if (month == 3 && date > 31) {value = "OK.  Whatever.";}

14 if (month == 4 && date >=20 || month == 5 && date <=20) {value = "金牛座";}

15 if (month == 4 && date > 30) {value = "I'm soooo sorry!";}

16 if (month == 5 && date >=21 || month == 6 && date <=21) {value = "双子座";}

17 if (month == 5 && date > 31) {value = "Umm ... no.";}

18 if (month == 6 && date >=22 || month == 7 && date <=22) {value = "巨蟹座";}

19 if (month == 6 && date > 30) {value = "Sorry.";}

20 if (month == 7 && date >=23 || month == 8 && date <=22) {value = "狮子座";}

21 if (month == 7 && date > 31) {value = "Excuse me?";}

22 if (month == 8 && date >=23 || month == 9 && date <=22) {value = "室女座";}

23 if (month == 8 && date > 31) {value = "Yeah. Right.";}

24 if (month == 9 && date >=23 || month == 10 && date <=22) {value = "天秤座";}

25 if (month == 9 && date > 30) {value = "Try Again.";}

26 if (month == 10 && date >=23 || month == 11 && date <=21) {value = "天蝎座";}

27 if (month == 10 && date > 31) {value = "Forget it!";}

28 if (month == 11 && date >=22 || month == 12 && date <=21) {value = "人马座";}

29 if (month == 11 && date > 30) {value = "Invalid Date";}

30 if (month == 12 && date >=22 || month == 1 && date <=19) {value = "摩羯座";}

31 if (month == 12 && date > 31) {value = "No way!";}

32 }

33 x = (start - birthyear) % 12

34 with (document.zodiac.csign){

35 if (x == 1 || x == -11) {value = "老鼠";}

36 if (x == 0) {value = "牛";}

37 if (x == 11 || x == -1) {value = "老虎";}

38 if (x == 10 || x == -2) {value = "兔子";}

39 if (x == 9 || x == -3)  {value = "龙";}

40 if (x == 8 || x == -4)  {value ="蛇";}

41 if (x == 7 || x == -5)  {value = "马";}

42 if (x == 6 || x == -6)  {value = "羊";}

43 if (x == 5 || x == -7)  {value = "猴子";}

44 if (x == 4 || x == -8)  {value = "鸡";}

45 if (x == 3 || x == -9)  {value = "狗";}

46 if (x == 2 || x == -10)  {value = "猪";}  

47 

48 }

49 }

50 //  End -->

51 </script>

52 <form name="zodiac">

53 <center>

54 <table bgcolor="#eeaa00" border="2" bordercolor="#000000" rules="none" cellspacing="0" cellpadding="4">

55     <tr><td><b><i>出生年份</i></b></td>

56     <td><div align="right"><input type="text" size="10" name="year" value="出生年份" onClick=value=""></div></td>

57     <td><!--This empty field is just for appearance--></td>

58     <tr><td><b><i>出生月份</i></b></td>

59     <td><div align="right">

60 <select name="month">

61 <option value="x">请选择一个月份</option>

62 <option value="1">一月</option><option value="2">二月</option><option value="3">三月</option>

63 <option value="4">四月</option><option value="5">五月</option><option value="6">六月</option>

64 <option value="7">七月</option><option value="8">八月</option><option value="9">九月</option>

65 <option value="10">十月</option><option value="11">十一月</option>

66 <option value="12">十二月</option></select></div></td>

67     <td><!--This empty field is just for appearance--></td></tr>

68     <tr><td><b><i>天</i></b></td>

69     <td><div align="right"><input type="text" name="date" value="天" size="3" onClick=value=""></td>

70     <td><input type="button" value="计算一下" onClick="signs()"></div></td></tr>

71     <tr><td><b><i>星座:</i></b></td>

72     <td><div align="right"><input type="text" name="sign" size="12" value="" align="right"></div></td></tr>

73     <td><!--This empty field is just for appearance--></td></tr>

74     <tr><td><b><i>属相:</i></b></td>

75     <td><div align="right"><input type="text" name="csign" size="12"></div></td>

76     <td><!--This empty field is just for appearance--></td></tr>

77 

78 </table>

79 </center>

80 </form>