jq 生成html

时间:2021-09-08
本文章向大家介绍jq 生成html,主要包括jq 生成html使用实例、应用技巧、基本知识点总结和需要注意事项,具有一定的参考价值,需要的朋友可以参考一下。
<div style="width:730px;">

             <input type="text" id="search_name7" name="search_name" value="" style="display:none;">
            <div style="height: 345px;margin-top:10px;width:730px;">

                <table class="table table-bordered mytable">
                    <thead>
                        <tr>
                            <th style="width:40%">行政相对人名称</th>
                            <th style="width:30%">发布机构</th>
                            <th style="width:20%">发布时间</th>
                        </tr>
                    </thead>
                    <tbody id="tabmenu5">


                    </tbody>
                </table>
            </div>

            <div style="height:80px;">

                <div class="myPagination"></div>

            </div>
            <div>
                <p>相关部门</p>
                <div style="width:730px">

                    <ul id="tabmenu51" style="padding: 0px;font-size:12px;">

                    </ul>
                </div>
            </div>
        </div>


$(document).on("click",".sel",function(){
            var id = $(this).attr("id");
            //alert("我的id属性值为:"+id);
             $("#search_name7").val(id);
            getList(1);
    });



     $(document).ready(function () {
         getList(1);

    });

    function getList(page) {
        //行政许可列表1

         let search_creater = $("#search_name7").val();

        if (!search_creater == false) {

        }else{
            search_creater='';
        }

  let obj={page:page,search_creater_id:search_creater};


        $.ajax({
            type: "get",
            url: url2,
            data: obj,
            dataType: "json",
            success: function (data) {

                console.log(data);
                console.log(data.data.page.list);


                let str = '';

                for (var i = 0; i < data.data.page.list.length; i++) {

                    str = str +
                        '<tr><td style="padding:4px;text-align:left"><a class="width-unchange" href="' +
                        urlStr + '/web/penaltyinformation/view/' + data.data.page.list[i].id +
                        '" target="_blank">' + data.data.page.list[i].cf_XDR_MC +
                        '</a></td><td style="padding:4px"><a class="width-unchange sel" id="'+ data.data.page.list[i].creater_id+'" href="javascript:void(0)" >' + data.data.page.list[i].creater_name +
                        '</a></td><td style="padding:4px">' + new Date(data.data.page.list[i]
                            .release_date).Format("yyyy-MM-dd") + '</td></tr>';
                }

                //console.log(str);

                let str1 = '';

                for (var i = 0; i < data.data.userlist.length; i++) {
                    str1 = str1 +
                        ' <li class="width-unchange" style="padding:4px;text-align: left;float:left;list-style-type:none;width: 25%;"><a href="javascript:void(0)" class="user sel" id="'+ data.data.userlist[i].id+'">' + data.data.userlist[i].name + '</a></li>';
                }


                $('#tabmenu5').html(str);
                $('#tabmenu51').html(str1);

                if (page == 1) {
                    $(".myPagination").Pagination({
                        page: page,
                        count: data.data.page.rowCount,
                        groups: 10,
                        onPageChange: function (page) {
                            console.log("当前是:" + page);
                            getList(page);
                        }
                    });
                }


            }

        });
    }

原文地址:https://www.cnblogs.com/foreXdd/p/15241593.html