仿花田：内部相亲网站 意中人(Asp.net MVC,Bootstrap2)

起因: 那是七月份了，看见单身的同事在上花田网，当时觉得风格比较清新，还没有世纪佳缘等那些网站那么商业化，加上又看到了bootrstrap，于是就想做个demo出来玩玩。中间自己又在做其他的事情，和web没有关系，也想没事的时候也可以练练web，到上个星期，干脆就发布在公司的内网了。没想到同事们mail一传，现在都有200多个人(我的公司是个制造业，这边全部的职工有2w+的人，除了产线上的小妹妹们，有电脑的也有好几千)注册了。同事说她宿舍的都和别人在上面聊到要见面了。我倒是有点高兴，倒是帮上了忙点忙。下面上图：

首页:  导航就是用的bootstrap，icon也是bootstrap2里面自带的。栏目是仿的网易下面的花田网站，然后下面一个轮播，将图片宽度撑到最大，自己在搜狗壁纸里面找的图，然后诠释一下。chrome下滑动起来还是很有感觉的。

但因为太刺眼了，有的人反应怕老板看见了不太好，就收起来了。

登录:  因为当时是在chrome下面自个做的，然后厂区的都是用个ie6 ie8，登录页面直接就苍白了。这里就不show了。

注册: 这里我要提醒下用mvc viewmodel自动生成create的同学，如果用默认的样式，很容易在ie家族中走样，在ie的安全模式下是注册不了的。

注册之后，会自动发送mail，系统发送欢迎的私信

推荐页：我先捞出已认证资料和图片的异性资料，然后再过滤掉黑名单，再根据每个人的择偶需求的选出符合的居住地，年龄，身高的人，最后根据恋爱观等算出两个人的匹配

进到 异性 的主页之后会看到匹配度的细则，这个是和花田的样式差不多，但花田做的更好。

对象搜索页：有个奇怪的现象就是 好几个女生要求查看同性 - -~，理由是男生不好看，而且有一个还和我聊个同志的话题...., 然后我就稍微改了下代码。捞出同性。

本来人物出来是可以点一个喜欢，但是在同性面前，我还是屏蔽了。暂不敢支持基情啊。还有，男生的图片一般都不咋地，随随便便整了一张。

个人主页：主页就包含了基本资料，详细资料，相册，动态。 图片上传就是用的上篇博客自己写的方法：http://www.cnblogs.com/stoneniqiu/p/3432114.html

但是，这个方法ie不支持！因为我是自动触发file元素click，ie认为是不安全的，网上也有些解决办法，我暂时就用了aspx 服务器控件的办法代替了。试了uploadfy，但是后台方法一直获取不到文件，还不知道为什么。用户热度是和这个人的登录次数，被喜欢，被hi，被访问的次数的一个综合。

单身部落： 当时因为没有互动环节，觉得用户来没意思就会走了，就看豆瓣的小组有意思，就搞了个简单版的，专门发话题：

恋爱通告是还没做的一个功能，还想加的东西太多了，比如我自己想了个许愿树 用户发布自己的想法（比如想逛街，看电影），然后异性收到，然后发布方选择谁去完成，最后给予评价。因为想两个要建立信任，还是要见面，还是要活动。

私信： 这个是个很实在的功能，用的也方便。 就是用的bootstrap的模态框做的。前端统一样式，一个a标签全部地方都可以调用。

寻芳踪就是记录了一些访问浏览以及私信，系统消息。一起的哥们，昨天有妹子主动搭了他，还激动了一把，但是然后就没有然后了。

后台的话，界面就简单一些，主要是审核用户资料，图片，处理举报，管理管理员，和数据统计。 功能上都需要扩展：

-----------------------------------------------------------我是分割线----------------------------------------------------------------

总结：

一、浏览器兼容问题：

1.ie家族的透明度是用filter调的，其他的浏览器是用的opacity。

2.jquery1.9.2,未定义的jquery错误，之前学jqueryui的时候用的一个版本，但发现ie老是报错，最后改成jquery1.7.2 稳定的，没有问题。没需要就不要用高版本。本身也没用到jquery ui。

3.缺少标示符，字符串或者数字的错误。

这是因为在写jquery的时候在最后的属性加了个逗号，ie认为是错误，脚本直接不能运行。 比如这个。黄色mark的这个逗号就是产生错误的原因。一般在写jquery动画，form ajax提交容易多写那么个逗号。

   var optionrequirement = {
        dataType: 'json',
        success: processJsonRequirement  ，
    };

4.子元素浮动ie下父级元素的宽度问题，在chrome中，我们定义子元素浮动，父级元素如果没有设宽度会适应子元素的宽度。但是ie中，父级元素没有设定的话就可能会自动占一行。这个大家要注意下。

5.form js htmlfile: 拒绝访问。

原因是图片域文件上传采用了脚本触发file.onclick代替默认的浏览所引起的js安全问题。ie6的时候file中是可以看到全路径的。

网上有说用 “采用css控制选择文件的样式透明，浮在选择照片的按钮上方就可以了”，但我觉得还是用专业的插件来完成这个活比较好。

6.低版本的ie 是不支持 form的required的，所以，还是要后台继续验证。

二、男同胞们的脱单问题！！！

先看数据：

虽然不能准确的反应单身男女的正真比例，但也可以说明竞争之激烈。差不多是3：1. 而且注册的很多都是90后。整个是个金字塔结构。咱们结婚吧 中有一句：单身久了都开始排斥异性了。这也是有道理的。所以还单着的同学们，真的要赶紧了。妹子是稀有资源，还有妹子的一定要好好珍惜~

三、我要干嘛

因为这个东西不是我的本质工作，耽误太多时间也不好，所以也没有打算再扩展什么功能。但是目前，服务器上方了git，日志系统。加上这个，远程已经打不开了。

周六用iis的，perfmon.msc 查看，同时连线的有三四十个人，今天周一，登录的人比较多，但也不会超过最大值。windows server的负载能力，宽带，还有自己的性能处理的不好，前端图片太多，头像没有做缩小的处理，后台的逻辑，缓存，数据库，都有很多可以优化的地方。不知道圆友们有什么建议。对于这整个系统，完全是个人兴趣，做个好人~ ~  其实在此之前，已经撮合了两对。但现在确实没有太多精力弄这个了。

最后，祝天下有情人终成眷属，IT男早日脱单~