关于前端的一些开发心得

  最近在弄运营平台，数据库设计的比较散，结构还比较清晰，开发起来也不怎么吃力，但是前端的要求比较高，其实从需求分析来说，做出来比较简单，但是从设计和产品的角度来说，用于体验要好，需要的做的比较精美。

  这里记下今天碰到的三个难题，以及解决办法，具体代码放在笔记了。

  1，批量判断空值。

我碰到的问题是这样的：做了一个数据导出功能，一开始加载页面的时候，取到所有的数据里的第一页，如果一开始什么条件都没有输入或者选择，导出的是全部数据，这个不符合习惯或者逻辑，导出的一般是经过选择的数据，所以这里有一个提取空值判断的结果问题。这个页面里有大概十多个条件，我不可能一行代码里连着十几个与操作。

  所以用了数组，javascript数组，然后用到了jquery封装的一个遍历方法$.each(Array,function(index,val){}); 

2,弹出层

  为了最大限度的利用空间，让数据的显示占据大部分，这里用到了弹出层，名字是好像是叫easyDailog,调用的easyDailog.open({content:{```}});但是这个层的大小不符合要求，要求的是100%的宽度，而这个脚本不支持百分比表示宽度，我就用了jquery拿到了它上一个事件源层的宽度，然后动态的给传了进去，达到了满意的效果。

3，悬浮一定时间触发事件

  因为做一个鼠标悬浮事件比较烦人，每次路过事件源层就弹出了一个层，使用上不方便，于是有了这么一茬，写了两个函数，一个是鼠标进入的函数，调用的是var myTime=window.showOnTime('函数名'，时间)，鼠标移出事件，调用的是closeTime(myTime),达到了想要的效果。

 

  先记下，明天贴出代码跟有兴趣的人分享，共同进步。 

 

代码如下：

function showQueryCondition() {

//    $("#queryHead").show();

    var $width = $("#hideorshow").width();

    $("#queryHead").css("width", $width);

    easyDialog.open({

        container:'queryHead',

        fixed:false,

        overlay:true,

        follow:'hidehref',

        followX:-parseInt($width) / 2 + 36,

        followY:18

    });

    showhide = false;

    $("#hidehref").html("隐藏搜索条件");

} 

 

//放到数组里

    var arr = new Array();

    arr.push(orderId);

    arr.push(endId);

    arr.push(userId);

    arr.push(playerId);

    arr.push(serverName);

    arr.push(startMoney);

    arr.push(endMoney);

    arr.push(channelId);

    arr.push(subType);

    arr.push(bank);

    arr.push(status);

    arr.push(payStartTime);

    arr.push(payEndTime);

    arr.push(assertStartTime);

    arr.push(assertEndTime);

    var nullOrNot = true;

    $.each(arr, function (key, val) {

        nullOrNot = nullOrNot && checkNullValue(val);

//        alert('key:'+key+' value:'+val + '结果：'+nullOrNot);

    }); 

 

var mytimer = null;

function timeInFn() {

    mytimer = window.setTimeout('showQueryCondition()', 1000);

}

function timeOutFn() {

    clearTimeout(mytimer);

    mytimer = -1;

}