list控件封装

2019独角兽企业重金招聘Python工程师标准>>>

list的用处还是蛮多的，现在把这些零散的代码整理一下，封装成一套模版，方便以后开发和维护

var list = new function () {
    var datalist = new Array();

    this.init = function initData() {
        for (i = 0; i < 10; i++) {
            datalist[i] = "item" + i;
        }
        initList();
    }

    function initList() {
        var htmls = "";
        for (i = 0; i < datalist.length; i++) {
            htmls += setUpItem(datalist[i]);
        }
        $(".list").html(htmls);
    }

     function setUpItem(str) {
        var span = str;
        var html =
            "            
\n" +
            "                " + span + "\n" +
            "            
\n";
        return html;
    }
}

.list{
    width: 100%;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

.list-item{
    background: #ffff00;
    margin: 20px;
    width: 80%;
    height:200px;
}

初始化，最好在main.js中统计初始化

list.init();

jquery的html方法，每次设置的时候都会清空过去的元素，甚是好用

这里采用js的闭包，所有与list相关的方法都封装到List里面，包括数据

js闭包，如果想暴露方法给外部访问，就要通过this.fun=function (){}的方式

通过var fun = function fun(){}默认是私有成员，直接function形式的也是私有成员

创建对象的时候，可以直接通过var object = new function(){}方式创建，有点像java的匿名内部类

转载于:https://my.oschina.net/carbenson/blog/1570556