`
annan211
  • 浏览: 460995 次
  • 性别: Icon_minigender_1
  • 来自: 广州
社区版块
存档分类
最新评论

js 标准化模板

 
阅读更多

    /********************* 页面全局变量定义  ************************/
    var size          = 15;
    var displayRecord = 15;
    var $nodata       = $('<div>查无数据</div>').hide();
    
    /********************* 初始化整个页面逻辑 ************************/
    $(document).ready(function(){
        //初始化日期控件
        $.page.initDateControl();
        //加载一次数据
        load();
    });
    
    /********************* 事件绑定   ************************/
    $("#serch").bind('click',function(){
        load();
    });
    
    /*********************方法定义  ************************/
    //加载数据
    function load(pageinfo){
    	
    	var url = "/admSup/list.do";
        //查询条件传后台
        var dataJson = {};
        if (pageinfo == undefined) {
			dataJson.size = size;
			dataJson.page = 1;
			dataJson.displayRecord=displayRecord;
		} else {
			dataJson.size = pageinfo.size;
			dataJson.page = pageinfo.page;
			dataJson.displayRecord=pageinfo.displayRecord;
		}

        var callback = function(obj) {
            if (obj.success) {
                var list = obj.object.lists || [];
                if(list.length>0){
                    $nodata.hide();
                }else{
                    $nodata.show();
                }
                renderTbale(list);
                dataJson.total = obj.object.total_num;
                renderPager(list,dataJson);
            }
        };

        $.ajax({
            url : url,
            data:dataJson,
            cache:false,
            dataType : "json",
            success : callback
        });    	
    }
    //传分页信息与展示数据,第一次查询需要封装初始分页信息
    function renderPager(list, pageInfo){
        new Pager({
            pageNo : pageInfo.page,
            pageSize : size,
            totalNum : pageInfo.total,//分页总条数放置message
            ctn : '.pager-ctn',
            aClickHandler : function(i) {
                var pageinfo = {
                    size : size,
                    page : i,
					displayRecord:displayRecord
                };
                page = i;
                load(pageinfo);
            },
            goClickHandler : function(i) {
                var pageinfo = {
                    size : size,
                    page : i,
					displayRecord:displayRecord
                };
                page = i;
                load(pageinfo);
            }
        });
    }
    //加载数据信息
    function renderTbale(list){
        list = eval(list);
        var _table = $("#sample_2");
        var _tbody = _table.find("tbody");
        //先清空tbody的数据
        var mytable = document.getElementById("sample_2");
        var rowNum=mytable.rows.length;
        while(rowNum!=1){
            mytable.deleteRow(1);
            rowNum=rowNum-1;
        }
        //拼装数据,用于显示

        for(var index = 0; index<list.length; index++){
            _tbody.append("<tr>" +
            		"<td>"+ (index+1)+"</td>" +
			        "<td>"+ list[index].pro_code+"</td>" +
			        "<td>"+ list[index].pro_name+"</td>" +
			        "<td>"+ list[index].complaint_time+"</td>" +
			        "<td>"+ (list[index].deal_result==0?"未处理":"已处理")+"</td>" +
			        "<td style='text-align:center;' ><a href='/admSup/op.jspx?id="+list[index].id+"'>"+ (list[index].deal_result==0?"处理":"查看")+"</a></td>" +
			        "</tr>");
        }
    }

分享到:
评论

相关推荐

    HTML+CSS+JS 网页设计模板.zip

    HTML、CSS和JavaScript是网页设计的三大核心技术,它们共同构建了网页的结构、样式和交互功能。...通过研究和修改这些模板,你可以深化对网页开发的理解,提升自己的技能,并快速构建出符合现代网页标准的交互式网站。

    基于JavaScript的项目框架模板

    "基于JavaScript的项目框架模板"通常是指一套预先配置好的代码结构和工具集,旨在加速和标准化JavaScript项目的开发流程。这样的框架模板可以包含各种依赖管理、构建工具、模块化方案以及测试框架等,为开发者提供了...

    html5 css3 JavaScript响应式中文静态网页模板js源代码(400套网页模板)

    《HTML5 CSS3 JavaScript响应式中文静态网页模板与JS源代码详解》 在现代网页设计领域,HTML5、CSS3和JavaScript是构建响应式、交互性强的中文静态网页的三大核心技术。本篇将深入探讨这三者如何共同打造一套完整的...

    CRMEB标准版及Pro首页PC模板最新版V4.5

    CRMEB标准版及Pro首页PC模板最新版V4.5是针对电商网站设计的一款高效、易用的前端模板,适用于PHP、JavaScript、Vue.js技术栈,并与小程序接口兼容。这款模板提供了丰富的功能和优化的用户体验,旨在为开发者提供一...

    一种将页面结构模板化的JS开发框架

    标题中的“一种将页面结构模板化的JS开发框架”指的是JavaScript中的一个库或框架,用于将HTML页面结构转化为可重用的、动态的数据驱动组件。这种技术使得开发者可以更高效地构建复杂的用户界面,同时保持代码的简洁...

    html5 css3 JavaScript响应式中文静态网页模板js源代码(220套网页模板)

    在这些模板中,JavaScript可能用于处理用户事件(如点击、滚动),实现AJAX异步数据交换,或者利用jQuery、Vue.js、React.js等库和框架增强功能。响应式设计常常利用JS检测设备特征,动态调整布局或内容。 这个资源...

    网页模板 网页 模板 20个网页模板 实用的网页模板,欢迎大家下载学习

    5. **JavaScript库与框架**:模板中可能包含jQuery、Vue.js、React或Angular等JavaScript库或框架,它们能够增强网页的交互性,如实现动态加载、表单验证和动画效果。 6. **内容管理系统(CMS)集成**:部分模板...

    标准网页模板

    【标准网页模板】是网页设计领域中的一个重要概念,它的核心目标是确保网页在各种不同的浏览器、设备和操作系统上都能保持一致且良好的展示效果。这样的模板通常遵循一系列的规范和最佳实践,以达到跨平台兼容性和...

    web2.0设计师个人主页css+xhtml+js全站模板

    【标题】:“Web2.0设计师个人主页CSS+XHTML+JS全站模板”是一个针对Web2.0设计理念,专为设计师打造的个人网站模板。它整合了CSS(层叠样式表)、XHTML(可扩展超文本标记语言)以及JavaScript(一种常用的客户端...

    网站模板(html,css,js)100套前端模板点击可打开,各个行业都有

    同时,考虑到SEO(搜索引擎优化),模板可能遵循了最佳实践,如使用正确的元标签、合理的URL结构和可访问性标准。 7. 使用与定制:对于开发人员来说,这些模板可以作为快速启动新项目的起点,通过修改现有的HTML...

    网站模板 css源码及js特效

    本压缩包“网站模板 css源码及js特效”显然是一个资源集合,包含了CSS源码和JavaScript特效,这些都是构建现代网页不可或缺的元素。 首先,CSS(Cascading Style Sheets)是一种样式表语言,用于描述HTML或XML...

    公司简约静态页面模板

    在公司简约静态页面模板中,HTML文件通常包含头部信息、导航栏、主体内容、页脚等部分,通过合理地使用标签来组织内容,确保页面结构的语义化,利于搜索引擎优化(SEO)。 CSS则负责网页的视觉呈现,包括颜色、字体...

    100套实用h5页面免费模板,html5网页模板,html5网站模板,html5网页制作模板

    在实际使用这些模板时,开发人员可以按照自己的需求进行定制,修改颜色、字体、图片和布局,甚至可以结合现有的框架(如Bootstrap、Vue.js或React.js)来进一步提升交互性和响应性。同时,模板中的注释代码可以帮助...

    CRMEB标准版PC前端模板2022新 V4.5,亲测可用!

    CRMEB标准版PC前端模板2022新 V4.5是一款专为CRMEB单商户系统设计的PC端网页模板,旨在提升网站在桌面设备上的用户体验,并且已通过实际测试验证其功能的可用性。这个模板是CRMEB框架下的一个重要组成部分,它为商家...

    400 套 html5 网站模板

    jQuery和Vue.js等JavaScript库和框架可能被集成到这些模板中,以简化开发过程并提高性能。 在400套HTML5模板中,每个模板可能具有独特的设计风格和功能。例如,有些可能是极简主义风格,适合个人博客;有些可能包含...

    国外html5+JS全套模板

    9. **JavaScript框架和库**:这些模板可能包含了诸如jQuery、Vue.js、React.js或Angular.js等流行的JavaScript库或框架,简化DOM操作,增强交互效果,以及实现组件化开发。 10. **Bootstrap和Material Design**:...

    HTML5扁平化电商网站模板是一款响应式Bootstrap商城模板。_html网站模板_网页源码移动端前端_H5模板_.rar

    HTML5扁平化电商网站模板是一款专为现代网络设计打造的响应式Bootstrap商城模板,它融合了最新的HTML5、CSS3以及JavaScript技术,为电商网站提供了高效、灵活且美观的解决方案。这款模板的设计理念在于提供简洁、...

    棕色纯色标准博客模板_棕色 纯色 标准 博客.zip

    这种模板适合那些希望保持博客内容清晰、易于阅读,同时又希望拥有个性化外观的博主们。在网页设计领域,纯色背景常常被用来强调内容,避免过于复杂的背景图案分散用户的注意力。 博客模板通常包含多个页面设计,如...

    灰色标准企业模板3281_html网站模板_网页源码移动端前端_H5模板_自适应响应式源码.rar

    标题中的“灰色标准企业模板3281_html网站模板_网页源码移动端前端_H5模板_自适应响应式源码”表明这是一个适用于企业的网站模板,采用灰色调设计,编号为3281。该模板是基于HTML语言构建的,特别强调了移动端前端的...

Global site tag (gtag.js) - Google Analytics