zoukankan      html  css  js  c++  java
  • 关于前端的一些开发心得

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

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

      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;

    } 

  • 相关阅读:
    pycharm连接数据库
    python之csv操作
    python网络爬虫之爬取图片
    行人重识别在深度学习方法的研究进展整理
    CVPR2016_Learning Deep Feature Representations with Domain Guided Dropout for Person Re-identification
    [转载]研究生导师:这种学生,才是我眼中的科研好苗子!
    [论文笔记]CVPR2016_Person re-identifcation by multi-channel parts-based cnn with improved triplet loss function
    [论文笔记]ECCV2016_A Siamese Long Short-Term Memory Architecture for Human Re-Identication
    LSTM学习理解资料
    [论文笔记]PersonNet: Person Re-identification with Deep Convolutional Neural Networks
  • 原文地址:https://www.cnblogs.com/snidget/p/2588934.html
Copyright © 2011-2022 走看看