C#开发

   此文要说的'知易营养健康系统'是b/s架构,用.net开发的应用程序,这里也只是说几点值得做类似项目或功能时需注意、借鉴的地方。

        图1:C#开发

       1. 如上图是‘营养计算器’页面,——看页面(http://zhiyi2010.s242.iis3.com/calculator/calory.aspx)就可以知道其大概的功能——主要包括:食物信息检索、添加食物到餐别中并分析所有餐别中食物各项营养素含量,整个页面的功能代码量主要集中在jquery+Ajax的运用,js代码量大概在1000行左右(大家可能会问:这个页面的功能有这么复杂,需要写这么多的js代码吗,——这个主要是我的实现方式的考虑所决定:想给用户比较好的用户体验,快速响应,后台只是做必要的数据处理),而且js代码还有待优化精简,下面贴出的是 其中的一个核心方法,更多的应用 如:鼠标点击出弹出 添加/修改 食物重量框,jquey中一些方法的使用...

    

function AddToCanBox(foodId,foodName,deHeat,isDefaultAdd,addWeight) 2     { 3         var can=GetHidCurrentCan(); 4         var canValue=GetHidCanValue(can); 5         var tempArray=new Array();//食物项数组 6         var foodProArray=new Array();//食物属性数组 7          8         var Weight_now=0; 9         var foodProStr="";10         var isHased=false;//标识此食物是否已存在11           12         var deWeight=100;13         addWeight=GetZhengshu(addWeight);14         addWeight=Round_number(addWeight);15         16         if(canValue!=null && canValue!="")//如果已存在此餐类别的食物17         {18             foodItemArray=canValue.split("|");19             var foodItem=new Array();20             var findId=null;21 22             for(var i in foodItemArray)23             {24                 foodItem=foodItemArray[i];//得到是的:1,232,34,45...字符串25                 if(foodItem!="" && foodItem!=null)26                 {27                     foodProArray=foodItem.split(",");28                     if(foodProArray!=null && foodProArray.length>0)29                     {30                         findId=foodProArray[0];//foodId31 32                         if(findId==foodId)//如果此食物已存在33                         {34                            Weight_now=foodProArray[3];//nowWeight35                            Weight_now=isDefaultAdd?(Number(Weight_now)+Number(deWeight)):(Number(Weight_now)+Number(addWeight));36                            Weight_now=Round_number(Weight_now);37                            foodProArray[3]=Weight_now;//修改其Weight_now38                            isHased=true;39                         }40                         foodProStr=foodProArray.join(",");41                         tempArray.push(foodProStr);//存放一个餐别下的食物信息42                     }43                 }44             }45         }46    47         foodProStr="";48         if(!isHased)//新添加的49         {50                foodProArray=new Array();51                foodProArray.push(foodId);52                foodProArray.push(foodName);53                foodProArray.push(deHeat);54 55                Weight_now=isDefaultAdd?deWeight:(addWeight==0?deWeight:addWeight);56                Weight_now=Round_number(Weight_now);57                foodProArray.push(Weight_now);58 59                foodProStr=foodProArray.join(",");60                tempArray.push(foodProStr);//存放一个餐别下的食物信息61         }62         63         DoAjax(tempArray,can,foodProStr,"");64     }

 

     2.滑动块等效果的实现.

    C#开发

        如上图,具体实现js代码,这里就不再贴出,需要的朋友可以直接下载参考使用:http://zhiyi2010.s242.iis3.com/calculator/energyloss.aspx

      3.立体柱状图的实现,效果如下:

      C#开发

    C#开发

   大家看图片就可以知道使用效果还不错,使用的是‘ FusionChart ’ flash 柱状图控件,其特点是:方便易用,且可以很好的使用ajax实现不同的条件显示(后台response

 输出xml),具体效果大家可以 登录网站  http://zhiyi2010.s242.iis3.com 注册会员后 在'营养足迹'里看到,有需要 这方面应用或学习的朋友,可以加我QQ(1030365071),即会给你

 emo,并互相学习和交流!

<script type="text/javascript"></script>