• 11-Index页面


    <html>

    <head>
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <title></title>
    <link href="~/Content/BootstrapSouce/css/bootstrap.css" rel="stylesheet" />
    <script src="~/Script/jquery-1.10.2.min.js"></script>

    <style type="text/css">

    /*html, body, header, div, main, p, span {
    margin: 0;
    padding: 0;
    }

    #refreshContainer {
    margin-left: 200px;
    }

    .refreshText {
    line-height: 50px;
    text-align: center;
    }*/

    #L1 {
    80px;
    height: 50px;
    }

    #L2 {
    300px;
    height: 50px;
    }

    #L3 {
    120px;
    height: 50px;
    }

    #L4 {
    200px;
    height: 50px;
    }

    #div {
    margin: 20px 200px 0 200px;
    height: 50px;
    }

    a:link {
    text-decoration: none;
    height: 50px;
    }
    </style>
    </head>

    <body>


    <p style="margin:80px 200px 0 200px ;"><label style="font-size:25px;">信息集市</label><a href="/News/Add">我要发布</a><input style="margin-left:100px;" type="text" id="Title" value="" /></p>
    <div id="div">
    <table class="table-condensed table-striped table "></table>
    <div>
    <input type="button" onclick="Prev()" value="上一页" id="but1" style="float:left;display:none;" />
    <input type="button" onclick="Next()" value="下一页" id="but2" style="float:right" />
    </div>
    <p id="p1"></p>
    <div style="margin:50px 0 10px 0"></div>
    </div>


    </body>
    </html>
    <script>
    var PageIndex = 1;
    var PageCount = 0;
    var PageSize = 0;
    var i = 0;

    $(function () {

    Show();


    })

    $("input").keydown(function (e) {//当按下按键时
    if (e.which == 13) {//.which属性判断按下的是哪个键,回车键的键位序号为13
    $('button.searchBtn').trigger("input");//触发搜索按钮的点击事件
    Show();

    }
    });

    function Show() {

    if (PageIndex == 1) {
    PageSize = 10;
    } else if (PageIndex == 2 || PageIndex == 3) {
    PageSize = 5;
    }



    $.ajax({
    url: "http://localhost:8888/News/GetNews",//?Title="+$("#Title").val(),
    type: "get",
    data: {
    Title: $("#Title").val(),
    Page: PageIndex,
    PAGESIZE: PageSize,
    },
    success: function (data) {
    PageIndex = data.PageIndex;
    PageCount = data.PageCount;
    i++;
    $("#p1").css("display", "none");
    if (i <= 3) {
    $("#p1").css("margin-left", "500px")

    setTimeout(function () {


    $("#p1").css("display", "block");
    $("#p1").html("加载中。。。")

    }, 1000);
    }
    else {
    $("table tr").remove();
    }

    $(data.Data).each(function (index, data) {
    $("table").append("<tr ><td id='L'><img src='" + data.TypeImg + "' /></td><td id='L2'><a href='/News/Comment?ID=" + data.ID + "' >" + data.Title + "</a></td><td id='L3'>" + data.Name + "</td><td id='L4'>" + data.CreateTime + "</td></tr>")

    })

    }

    })

    }


    var z = 0;
    function Next() {
    z++;
    if (PageIndex >= PageCount) {

    return;
    }

    if (z == 3) {
    $("#but1").css("display", "block");

    } else if(i<3){
    $("#but1").css("display", "none");

    // $("#p1").html("加载中。。。");

    // $("#p1").css("display", "block");
    }
    PageIndex++;
    Show();

    }

    function Prev() {

    if (PageIndex <= 1) {
    z = 0;
    return;
    }

    PageIndex--;
    Show();
    }

    //(function (window) {
    // // 获取当前滚动条的位置
    // function getScrollTop() {
    // var scrollTop = 0;
    // if (document.documentElement && document.documentElement.scrollTop) {
    // scrollTop = document.documentElement.scrollTop;
    // } else if (document.body) {
    // scrollTop = document.body.scrollTop;
    // }
    // return scrollTop;
    // }
    // // 获取当前可视范围的高度
    // function getClientHeight() {
    // var clientHeight = 0;
    // if (document.body.clientHeight && document.documentElement.clientHeight) {
    // clientHeight = Math.min(document.body.clientHeight, document.documentElement.clientHeight);
    // }
    // else {
    // clientHeight = Math.max(document.body.clientHeight, document.documentElement.clientHeight);
    // }
    // return clientHeight;
    // }
    // // 获取文档完整的高度
    // function getScrollHeight() {
    // return Math.max(document.body.scrollHeight, document.documentElement.scrollHeight);
    // }
    // var _text = document.querySelector('.refreshText'),
    // _container = document.getElementById('refreshContainer');
    // var throttle = function (method, context) {
    // clearTimeout(method.tId);
    // method.tId = setTimeout(function () {
    // method.call(context);
    // }, 300);
    // }
    // function fetchData() {
    // setTimeout(function () {
    // _container.insertAdjacentHTML('beforeend', '<p>new add...</p>');
    // }, 100);
    // }
    // function fetch() {
    // //alert(getScrollTop());
    // //alert(getClientHeight());
    // ////alert(getScrollHeight());
    // //if (getScrollTop() + getClientHeight() == getScrollHeight()) {
    // //alert(1);
    // _text.innerText = '加载中...';
    // throttle(fetchData);
    // //}
    // };
    //})(window);
    </script>

  • 相关阅读:
    一维函数指针数组和二维函数指针数组demo
    等着新工作
    SSRS常见问题解决方案
    速度
    javascript 满足多层treeview的各种勾选
    vue create 初步解析以及定制化修改
    leveldb总结
    秋招总结场景设计题
    NOSQL: mongoDB windows
    更新webconfig配置文件
  • 原文地址:https://www.cnblogs.com/Wangyang11/p/10003746.html
Copyright © 2020-2023  润新知