• 一次项目总结,内容设置页面


    1.如果前端页面是增删查改这种需求,采用MVC思想开发。

    MVC,基本思想是,Model层发生变化,就通知View层;View层发生变化,就通知Model层;Control层就是设置变化入口。

    Model处理,View处理要隔离开。

    用js对象进行变量和函数分类。

    2.后台数据放入前台html页面里面,会发生html编码。

    要进行解码,如果用jquery,可用$("<div/>").html(json_string).text()

    3.最简单的异步图片上传

    构造一个隐藏的iframe,和一个隐藏的input type="file"的html元素,把图片上传的表单指向它。

    用iframe的load事件,来监听图片上传返回的信息。

    再根据后台返回的信息,进行判断数据上传成功与否。

    4.离开页面判断内容是否修改过

    window.onbeforeunload = function(event){
    if(condition){
    event.returnValue = "内容已发生修改,确定不保存而离开页面吗?";
    return "内容已发生修改,确定不保存而离开页面吗?";
    }
    }

    5.弹窗制作

    一个半透明黑色背景,一个框z-index大于半透明黑色背景。

    6.用jQuery绑定某个元素的点击事件,某个元素的点击事件里面又绑定其它事件。

    问题:点击几次,点击事件里绑定的其它事件,也就执行几次。

    解决:用jQuery的unbind方法。

    7.json比较

    将json字符串化进行比较两者不同。

    8.js对象复制

    $.extend(true, {},被复制的对象);//使用jquery库

    9.用jquery设置获取textarea的值

    请用$(textarea的id).val()

    10.页面布局的时候,先作好脑图,确定存在哪些元素。然后写出所有静态元素。

    11.写页面交互的时候,先做好脑图。

    12.IE6兼容性

    IE6这东西,实在不想说她。杀精的。

    1.inline-block兼容

    *zoom:1;
    *display:inline;
    display: inline-block;

    2.遮罩层兼容

    overflow: hidden;
    100%;
    height: 100%;
    border: 0px;
    padding: 0px;
    margin: 0px;
    top: 0px;
    left: 0px;
    display: none;
    visibility: visible;
    background-color:#000;
    opacity: 0.7;
    -moz-opacity: 0.7;
    filter: alpha(opacity=70);
    position: absolute;
    z-index: 100;

    浮于遮罩层上

    top: 20%;
    left: 33%;
    display: none;
    visibility: visible;
    position: absolute;
    z-index: 1000;
    480px;
    background: #FFFFFF;
    border: 5px solid #ccc;
    line-height: 20px;
    margin: 0;

    处于同一个父元素之下。

    3.JS里面一些事件里,window自带的变量里,IE6没有相关,要判断。

    13.多行文字垂直居中

    将多行文字放在一个block里,设置一致的padding-top和padding-bottom。

  • 相关阅读:
    12C 中,发生脑裂时,节点保留策略
    如何修改集群的公网信息(包括 VIP)
    从 ASH 找到消耗 PGA 和 临时表空间 较多的 Top SQL_ID
    Oracle SCN详解
    10046 trace
    使用trace文件定位ORA-00060问题
    (转)计算机漏洞安全相关的概念POC 、EXP 、VUL 、CVE 、0DAY
    PowerShell 相关常用命令(update...)
    (转)主从同步常遇见问题处理-线上MYSQL同步报错故障处理总结
    pentestbox 安装后的基本设置
  • 原文地址:https://www.cnblogs.com/samwu/p/2954602.html
Copyright © 2020-2023  润新知