• 企业400电话
  • 微网小程序
  • AI电话机器人
  • 电商代运营
  • 全 部 栏 目

    企业400电话 网络优化推广 AI电话机器人 呼叫中心 网站建设 商标✡知产 微网小程序 电商运营 彩铃•短信 增值拓展业务
    Ajax读取txt并对txt内容进行分页显示功能

    下文给大家分享了ajax读取txt并对txt内容进行分页显示的核心代码,废话不多说了,直接贴代码了。

    function TransferString(content)
    {
    var string = content;
    try{
    string=string.replace(/\r\n/g,"BR>")
    string=string.replace(/\n/g,"BR>");
    string=string.replace(/[ ]/g,"nbsp;")
    string=string.replace(/\ +/g,"nbsp;")
    }catch(e) {
    alert(e.message);
    }
    return string;
    }
    var pageIndex = 1;
    var id = $("#aId").val();
    var url = $('#urlArticleContent').val();
    var txt = '';
    var pageSize = @(ConfigurationManager.AppSettings["ArticlepageSize"]);
    var page=5;
    var pageCount = 0;
    $(function() {
    if(url!="")
    {
    txt = ($.ajax({ url: url, async: false })).responseText;
    if (txt.indexOf('http://www.w3.org/1999/xhtml')==-1) {
    pageCount = Math.ceil(txt.length / pageSize);
    $("#PageCount").html(pageCount);
    $('#word').html(TransferString(txt.substring(0, pageSize)));
    $('#demo').pagination({
    dataSource: function(done){
    var result = [];
    for (var i = 1; i  pageCount; i++) {
    result.push(i);
    }
    done(result);
    },
    pageCount:pageCount,
    pageSize: 5,
    showGoInput: true,
    showGoButton: true,
    callback: function(data, pagination) {
    // template method of yourself
    var html = template(data);
    dataContainer.html(html);
    }
    })
    } else {
    txt = '';
    }
    }
    })
    function GoHead() {
    GoPage(1);
    }
    function NextClick() {
    if (pageIndex  pageCount) {
    pageIndex = pageIndex + 1;
    } else {
    pageIndex = pageCount;
    }
    GoPage(pageIndex);
    $("#pageCurrent").html(pageIndex);
    }
    function backClick() {
    if (pageIndex > 1) {
    pageIndex = pageIndex - 1;
    GoPage(pageIndex);
    $("#pageCurrent").html(pageIndex);
    }
    }
    function GoPageNew() {
    var page=$("#pageGo").val();
    GoPage(page);
    opts.current=page;
    }
    function GoPage(pageIndex) {
    if(pageIndex==0) {
    pageIndexStr = $('#goPage').val();
    if (pageIndexStr==undefined) {
    return false;
    }
    pageIndexStr = pageIndexStr.trim();
    var pageIndex = parseInt(pageIndexStr);
    }
    $('#page'+pageIndex).siblings().removeClass('active');
    $('#page'+pageIndex).addClass('active');
    if (pageIndex==1) {
    if(!$('#backClick').hasClass('disabled')) {
    $('#backClick').addClass('disabled');
    }
    } else {
    $('#backClick').removeClass('disabled');
    }
    if (pageIndex == pageCount) {
    if(!$('#nextClick').hasClass('disabled')) {
    $('#nextClick').addClass('disabled');
    }
    } else {
    $('#nextClick').removeClass('disabled');
    }
    var pageTxt = txt.substring((pageIndex - 1) * pageSize, pageIndex * pageSize);
    $('#word').html(TransferString(pageTxt));
    $('html, body').animate({
    'scrollTop': 0
    }, 0);
    $("#pageCurrent").html(pageIndex);
    }
    function PageGo(){ if($('.jump-ipt').val()!=''){
    GoPage($('.jump-ipt').val())
    }
    }
    @{
    if (null != ViewBag.Ariticle)
    {
    DataRow dr = ViewBag.Ariticle;
    if (null != dr)
    {
    ViewBag.Title = dr["Title"];
    div class="container">
    div class="row">
    div class="col-xs-12">
    div class="breadcrumb_block">
    span class="tit">a href="/web/sciencefiction/index">科普IP/a> gt;/span>
    ol class="breadcrumb">
    li class="active">@dr["Title"]/li>
    li class="active">在线试读/li>
    /ol>
    div class="clear">/div>
    /div>
    /div>
    div class="col-sm-8">
    input type="hidden" name="aId" id="aId" value="@Request["id"]" />
    div class="read_book">
    h3 class="read_tit">@dr["Title"]/h3>
    div class="author">
    span class="ml30">em id="pageCurrent">1/em>/em id="PageCount">0/em>/span>
    /div>
    input type="hidden" value="@dr["FilePath"]" id="urlArticleContent">
    div class="word" id="word">
    nav class="page-my">
    ul class="pagination pull-right fs14" id="demo">/ul>
    div class="clear">/div>
    /nav>
    !--底部翻页-->
    /div>
    div class="col-sm-3">
    input type="hidden" name="pageCount" id="pageCount" value="@ViewBag.pageCount" />
    !--阅读控制-->
    div class="read_control">
    a href="javascript:;" onclick="backClick()">span class="icon icon01">/span>em>上一页/em>/a>
    a href="javascript:;" onclick="NextClick()">span class="icon icon02">/span>em>下一页/em>/a>
    a href="javascript:;" onclick="GoHead()">span class="icon icon03">/span>em>回首页/em>/a>
    /div>
    /div>
    /div>
    /div>
    }
    }
    }

    txt文件上传时需要做一些处理,否则只能显示UTF8格式的txt

    /// summary>
    /// 文件上传
    /// /summary>
    /// returns>/returns>
    public JsonResult UploadFiles()
    {
    
    HttpPostedFileBase postFile = HttpContext.Request.Files["filesave"];
    if (postFile != null)
    {
    string fileName = Path.GetFileName(postFile.FileName);
    string fileExt = Path.GetExtension(fileName.ToLower());
    string fileSize = postFile.ContentLength.ToString();
    long fileNameTem = Common.GenerateLongId();
    string sPath = string.Format("/Data/Material/{0}_{1}.txt", fileNameTem.ToString(), fileName.Replace(".txt", ""));//Guid.NewGuid().ToString().Replace("-", "")
    string viewUrl = string.Empty;
    string g = Guid.NewGuid().ToString();
    if (!Directory.Exists(Server.MapPath("~") + "/Data/Material"))
    Directory.CreateDirectory(Server.MapPath("~") + "/Data/Material");
    string p = Server.MapPath(sPath);
    postFile.SaveAs(p);
    
    if (System.IO.File.Exists(p))
    {
    StreamReader sr = new StreamReader(p, System.Text.Encoding.Default);
    String input = sr.ReadToEnd();
    sr.Close();
    
    StreamWriter sw = new StreamWriter(p, false, System.Text.Encoding.UTF8);
    sw.WriteLine(input);
    sw.Close();
    }
    return Json(new { FilePath = sPath, FileName = fileName, viewurl = viewUrl, fileSize = fileSize });
    }
    else
    {
    return Json(new { FilePath = "" });
    }
    }
    

    另外页面首页引入js

    script src="~/Scripts/web/jquery.pagination.js">/script>
    link href="~/Content/jquery.pagination.css" rel="stylesheet" />
    /**
    * pagination分页插件
    * @version 1.1.2
    * @author mss
    * @url http://maxiaoxiang.com/plugin/pagination.html
    * @E-mail 251445460@qq.com
    *
    * @调用方法
    * $(selector).pagination();
    * 
    * @更新日志
    * 2016-07-25:修复click重复事件
    */
    ; (function ($, window, document, undefined) {
    //配置参数
    var defaults = {
    totalData: 0, //数据总条数
    showData: 0, //每页显示的条数
    pageCount: 9, //总页数,默认为9
    current: 1, //当前第几页
    prevCls: 'prev', //上一页class
    nextCls: 'next', //下一页class
    prevContent: '上一页', //上一页内容
    nextContent: '下一页', //下一页内容
    activeCls: 'active', //当前页选中状态
    coping: false, //首页和尾页
    homePage: '', //首页节点内容
    endPage: '', //尾页节点内容
    count: 5, //当前页前后分页个数
    jump: true, //跳转到指定页数
    jumpIptCls: 'jump-ipt', //文本框内容
    jumpBtnCls: 'jump-btn', //跳转按钮
    jumpBtn: '跳转', //跳转按钮文本
    callback: function () { 
    } //回调
    };
    var Pagination = function (element, options) {
    //全局变量
    var opts = options,//配置
    current,//当前页
    $document = $(document),
    $obj = $(element);//容器
    /**
    * 设置总页数
    * @param int page 页码
    * @return opts.pageCount 总页数配置
    */
    this.setTotalPage = function (page) {
    return opts.pageCount = page;
    };
    /**
    * 获取总页数
    * @return int p 总页数
    */
    this.getTotalPage = function () {
    var p = opts.totalData || opts.showData ? Math.ceil(parseInt(opts.totalData) / opts.showData) : opts.pageCount;
    return p;
    };
    //获取当前页
    this.getCurrent = function () {
    return current;
    };
    /**
    * 填充数据
    * @param int index 页码
    */
    this.filling = function (index) {
    var html = '';
    current = index || opts.current;//当前页码
    var pageCount = this.getTotalPage();
    if (current > 1) {//上一页
    html += 'li onclick=GoPage(' + (current - 1) + ')>a href="javascript:;" class="' + opts.prevCls + '">' + opts.prevContent + '/a>/li>';
    } else {
    $obj.find('.' + opts.prevCls)  $obj.find('.' + opts.prevCls).remove();
    }
    if (current >= opts.count * 2  current != 1  pageCount != opts.count) {
    var home = opts.coping  opts.homePage ? opts.homePage : '1';
    html += opts.coping ? 'li onclick=GoPage(' + home + ')>a href="javascript:;" data-page="1">' + home + '/a>/li>span>.../span>' : '';
    }
    var start = current - opts.count,
    end = current + opts.count;
    ((start > 1  current  opts.count) || current == 1)  end++;
    (current > pageCount - opts.count  current >= pageCount)  start++;
    for (; start = end; start++) {
    if (start = pageCount  start >= 1) {
    if (start != current) {
    html += 'li onclick=GoPage(' + start + ')>a href="javascript:;" data-page="' + start + '">' + start + '/a>/li>';
    } else {
    html += 'li class="' + opts.activeCls + '" onclick=GoPage(' + start + ')>a href="javascript:;">span>' + start + '/span>/a>/li>';
    }
    }
    }
    if (current + opts.count  pageCount  current >= 1  pageCount > opts.count) {
    var end = opts.coping  opts.endPage ? opts.endPage : pageCount;
    html += opts.coping ? 'span>.../span>li onclick=GoPage(' + pageCount + ')>a href="javascript:;" data-page="' + pageCount + '">' + end + '/a>/li>' : '';
    }
    if (current  pageCount) {//下一页
    html += 'li onclick=GoPage(' + (current + 1) + ')>a href="javascript:;" class="' + opts.nextCls + '">' + opts.nextContent + '/a>/li>'
    } else {
    $obj.find('.' + opts.nextCls)  $obj.find('.' + opts.nextCls).remove();
    }
    html += opts.jump ? 'input type="text" class="' + opts.jumpIptCls + '">a href="javascript:;" onclick=PageGo() class="' + opts.jumpBtnCls + '">' + opts.jumpBtn + '/a>' : '';
    $obj.empty().html(html);
    };
    //绑定事件
    this.eventBind = function () {
    var self = this;
    var pageCount = this.getTotalPage();//总页数
    $obj.off().on('click', 'a', function () {
    if ($(this).hasClass(opts.nextCls)) {
    var index = parseInt($obj.find('.' + opts.activeCls).text()) + 1;
    } else if ($(this).hasClass(opts.prevCls)) {
    var index = parseInt($obj.find('.' + opts.activeCls).text()) - 1;
    } else if ($(this).hasClass(opts.jumpBtnCls)) {
    if ($obj.find('.' + opts.jumpIptCls).val() !== '') {
    var index = parseInt($obj.find('.' + opts.jumpIptCls).val());
    } else {
    return;
    }
    } else {
    var index = parseInt($(this).data('page'));
    }
    self.filling(index);
    typeof opts.callback === 'function'  opts.callback(self);
    });
    //输入跳转的页码
    $obj.on('input propertychange', '.' + opts.jumpIptCls, function () {
    var $this = $(this);
    var val = $this.val();
    var reg = /[^\d]/g;
    if (reg.test(val)) {
    $this.val(val.replace(reg, ''));
    }
    (parseInt(val) > pageCount)  $this.val(pageCount);
    if (parseInt(val) === 0) {//最小值为1
    $this.val(1);
    }
    });
    //回车跳转指定页码
    $document.keydown(function (e) {
    var self = this;
    if (e.keyCode == 13  $obj.find('.' + opts.jumpIptCls).val()) {
    var index = parseInt($obj.find('.' + opts.jumpIptCls).val());
    GoPage(index);
    //self.filling(index);
    //typeof opts.callback === 'function'  opts.callback(self);
    }
    });
    };
    //初始化
    this.init = function () {
    this.filling(opts.current);
    this.eventBind();
    };
    this.init();
    };
    $.fn.pagination = function (parameter, callback) {
    if (typeof parameter == 'function') {//重载
    callback = parameter;
    parameter = {};
    } else {
    parameter = parameter || {};
    callback = callback || function () { };
    }
    var options = $.extend({}, defaults, parameter);
    return this.each(function () {
    var pagination = new Pagination(this, options);
    callback(pagination);
    });
    };
    })(jQuery, window, document);

    以上所述是小编给大家介绍的Ajax读取txt并对txt内容进行分页显示,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对脚本之家网站的支持!

    您可能感兴趣的文章:
    • Ajax的使用代码解析
    • PHP AjaxForm提交图片上传并显示图片源码
    • JS 拦截全局ajax请求实例解析
    • Ajax遍历jSon后对每一条数据进行相应的修改和删除(代码分享)
    • AJAX工作原理及优缺点详解
    • AngularJS实现ajax请求的方法
    • 使用Ajax生成的Excel文件并下载的实例
    • Ajax的概述与实现过程
    • AJAX请求队列实现
    • 在Thinkphp中使用ajax实现无刷新分页的方法
    • jstree创建无限分级树的方法【基于ajax动态创建子节点】
    • JavaScript将base64图片转换成formData并通过AJAX提交的实现方法
    • jQuery插件ajaxFileUpload异步上传文件
    • 浅析Ajax语法
    上一篇:深入理解ajax系列第一篇之XHR对象
    下一篇:AJAX请求队列实现
  • 相关文章
  • 

    © 2016-2020 巨人网络通讯 版权所有

    《增值电信业务经营许可证》 苏ICP备15040257号-8

    Ajax读取txt并对txt内容进行分页显示功能 Ajax,读取,txt,并对,内容,