zoukankan      html  css  js  c++  java
  • js 一数组分割成若干个数组,并装换成字符串赋个li标签

    success: function (datas) { //请求成功后处理函数。
                        var htmltext = '';
                        var data = datas.result;
                        console.log(data)
                        var ihtml = [];
                        for (var i in data) {
                            ihtml.push('<div class="col-md-3 col-sm-6 col-xs-6">'
                                + '<img src="' + data[i].img + '" width="240" height="180"/>'
                                + '</div>')
    
                        }
                       
                        var len = ihtml.length/4;
                        len = parseInt(ihtml.length%4!=0?len+1:len);
                        console.log(len);
                        for(var i=0;i<len;i++){
                            var start = i*4;
                            var end = start+4;
                            end = end>ihtml.length?ihtml.length:end;
                            ihtml.slice(start,end);
                            console.log(ihtml.slice(start,end))
                            htmltext += '<li>' +
                                '' + (ihtml.slice(start,end)).join("") + '' +
                                '</li>'
                                console.log(1)
                        }
    
    
                        console.log(ihtml)
                        console.log(htmltext);
                        $(".coop-ul").html(htmltext);
                     
    
                    },
    <ul class="coop-ul">
                        <li>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/01.png" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/02.png" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/03.png" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/04.png" width="190">
                                <!-- </a> -->
                            </div>
                        </li>
                        <li class="li2">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/05.png" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/06.png" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/07.png" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/08.png" width="190">
                                <!-- </a> -->
                            </div>
                        </li>
                        <li class="li3">
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/09.jpg" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/10.jpg" width="190" height="120">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/07.png" width="190">
                                <!-- </a> -->
                            </div>
                            <div class="col-md-3 col-sm-6 col-xs-6">
                                <!-- <a href="javascript:return false;" target="_blank"> -->
                                <img src="img/08.png" width="190">
                                <!-- </a> -->
                            </div>
                        </li>
                    </ul>
  • 相关阅读:
    文本PDG文件名构成
    关于文本PDG的字体
    Oracle 11G R2 在windows server 2008 64位安装时提示:无法在windows "开始"菜单或桌面上创建项
    GTONE上安装插件无法显示SecurityPrism菜单
    Centos系统下Lamp环境的快速搭建(超详细)
    Windows 10激活
    word如何让单页变横向
    redhat 6.x 上创建用户
    redhat下网络的配置
    Windows 10、Windows 2012 安装 Oracle 11g 报错:[INS-13001]环境不满足最低要求。
  • 原文地址:https://www.cnblogs.com/opcec/p/13365658.html
Copyright © 2011-2022 走看看