jQuery实现根据生日计算年龄 星座 生肖

<html>
<head>
 <title></title>
 <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script>

 <script type="text/javascript">
 //根据输入的生日自动获取星座,生肖和年龄。
 var year = new Array("猪", "鼠", "牛", "虎", "兔", "龙", "蛇", "马", "羊", "猴", "鸡", "狗");
 jQuery(function () {
  $("#Birthday").blur(function () {
  setTimeout(function () {
   var strHtml = "";
   var date = new Date($("#Birthday").val().replace(/-/g, "/"));
   var con = getxingzuo(date.getMonth() + 1, date.getDate());
   strHtml += "你的星座是:" + con;
   var zodiac = year[(parseInt(date.getFullYear()) + 9) % 12];
   strHtml += "<br/>你的生肖是:" + zodiac;
   var Age = new Date().getFullYear() - date.getFullYear();
   strHtml += "<br/>你的年龄是:" + Age;
   $("#div1").append(strHtml);
  }, 200);
  })
 })
 function getxingzuo(month, day) {
  var d = new Date(1999, month - 1, day, 0, 0, 0);
  var arr = [];
  arr.push(["魔羯座", new Date(1999, 0, 1, 0, 0, 0)])
  arr.push(["水瓶座", new Date(1999, 0, 20, 0, 0, 0)])
  arr.push(["双鱼座", new Date(1999, 1, 19, 0, 0, 0)])
  arr.push(["牡羊座", new Date(1999, 2, 21, 0, 0, 0)])
  arr.push(["金牛座", new Date(1999, 3, 21, 0, 0, 0)])
  arr.push(["双子座", new Date(1999, 4, 21, 0, 0, 0)])
  arr.push(["巨蟹座", new Date(1999, 5, 22, 0, 0, 0)])
  arr.push(["狮子座", new Date(1999, 6, 23, 0, 0, 0)])
  arr.push(["处女座", new Date(1999, 7, 23, 0, 0, 0)])
  arr.push(["天秤座", new Date(1999, 8, 23, 0, 0, 0)])
  arr.push(["天蝎座", new Date(1999, 9, 23, 0, 0, 0)])
  arr.push(["射手座", new Date(1999, 10, 22, 0, 0, 0)])
  arr.push(["魔羯座", new Date(1999, 11, 22, 0, 0, 0)])
  for (var i = arr.length - 1; i >= 0; i--) {
  if (d >= arr[i][1]) return arr[i][0];
  }
 }
 </script>
</head>
<body>
 <div id="div1" style="width:200px;height:200px;">
  <input type="text" id="Birthday" value="请输入你的生日!" />
  <input type="button" value="开始计算" />
 </div>
</body>
</html>

以上就是本文的全部内容,希望对大家有所帮助,谢谢对我们的支持!

(0)

相关推荐

  • 一个简单的jQuery计算器实现了连续计算功能

    一个简单的jQuery计算器,只是实现了一个连续计算的功能 <!DOCTYPE html> <html> <head> <meta charset="utf8"/> <title>Javascript计算器</title> </head> <body> <table> <tr> <td colspan="4"><input id=

  • jQuery实现购物车多物品数量的加减+总价计算

    复制代码 代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>jQuery实现购物

  • 基于HTML+CSS,jQuery编写的简易计算器后续(添加了键盘监听)

    之前发布了一款简易的计算器,今天做了一下修改,添加了键盘监听事件,不用再用鼠标点点点啦 JS代码: var yunSuan = 0;// 运算符号,0-无运算;1-加法;2-减法;3-乘法;4-除法 var change = 0;// 属于运算符后需要清空上一数值 var num1 = 0;// 运算第一个数据 var num2 = 0;// 运算第二个数据 var cunChuValue = 0;// 存储的数值 $(function() { $(".number").click(f

  • jQuery计算textarea中文字数(剩余个数)的小程序

    复制代码 代码如下: <div class="area">        <p>            还可以输入<b class="num">140</b>字</p>        <textarea class="chackTextarea"></textarea>    </div> <script type="text/java

  • 基于jQuery的计算文本框字数的代码

    一.功能: 1.用户边输入计算同时进行,告诉用户还剩余多少可输入的字数; 2.当超过规定的字数后,点击确定,会让输入框闪动 二.功能分析 1.重点是用什么事件? 标准浏览器用oninput,而IE则使用onpropertychange ,这两个事件的发生条件,是文本框的值发生改变. 2.字数的计算. 2.1一个中文算两个,一个符号或数字,英文,算一个.(如果是规定140个字,乘以2,那么就是280个) 2.2需要用到Math.ceil方法,因为最后还是要除以2来还原显示给用户的字数; 3.闪动背

  • jquery精度计算代码 jquery指定精确小数位

    本文实例为大家分享了jquery指定精确小数位的具体代码,供大家参考,具体内容如下 /** * 将标签的值格式化 * id 标签id * min 最小值 * max 最大值 */ function toFloat(id,min,max){ var htmlVal = $("#"+id).html(); var index = htmlVal.indexOf("."); var result = ""; if(index > 0){ html

  • js数值计算时使用parseInt进行数据类型转换(jquery)

    js获取到的数据默认都是string字符串类型的,如果进行数值的运算必须使用parseInt进行转换成数值的操作. html代码: 复制代码 代码如下: <div id="archive">     <input type="hidden" name="page" value="1" /> </div> js代码: 复制代码 代码如下: $("#archive").bin

  • jQuery实现购物车计算价格功能的方法

    本文实例讲述了jQuery实现购物车计算价格功能的方法.分享给大家供大家参考.具体如下: 目的 实现在html界面修改购物车的件数,购物车商品价格的小计和总计要修改. 实现思路 1.当点击进入界面,刷新的时候触发body内的onload=""方法,跳转到JS代码.这样做的原因是在数据库内我们只会存储某客户的准备购买的商品件数,而不会存储每类商品价格的小计和购物车内所有物品的商品总价格,初始化的目的就是为将这些数字计算出来后显示在前台界面上. 2.当更改数量输入框中每个商品的数量时,整个

  • jQuery实现的简单在线计算器功能

    本文实例讲述了jQuery实现的简单在线计算器功能.分享给大家供大家参考,具体如下: 先来看看运行效果图: 完整代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/x

  • Jquery AJAX 用于计算点击率(统计)

    复制代码 代码如下: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> Demo </TITLE> </HEAD> <BODY> <script src="jquery.js" type="text/javascript"></

随机推荐