主頁 > 知識庫 > Ajax讀取txt并對txt內(nèi)容進行分頁顯示功能

Ajax讀取txt并對txt內(nèi)容進行分頁顯示功能

熱門標簽:上海企業(yè)外呼系統(tǒng)價錢 河間市地圖標注app 怎樣在地圖標注文字 電銷機器人 長春 地圖標注推銷坑人 立陶宛地圖標注 東平縣地圖標注app 中國地圖標注不明確情況介紹表 大眾點評400電話怎么申請

下文給大家分享了ajax讀取txt并對txt內(nèi)容進行分頁顯示的核心代碼,廢話不多說了,直接貼代碼了。

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) {
//配置參數(shù)
var defaults = {
totalData: 0, //數(shù)據(jù)總條數(shù)
showData: 0, //每頁顯示的條數(shù)
pageCount: 9, //總頁數(shù),默認為9
current: 1, //當前第幾頁
prevCls: 'prev', //上一頁class
nextCls: 'next', //下一頁class
prevContent: '上一頁', //上一頁內(nèi)容
nextContent: '下一頁', //下一頁內(nèi)容
activeCls: 'active', //當前頁選中狀態(tài)
coping: false, //首頁和尾頁
homePage: '', //首頁節(jié)點內(nèi)容
endPage: '', //尾頁節(jié)點內(nèi)容
count: 5, //當前頁前后分頁個數(shù)
jump: true, //跳轉到指定頁數(shù)
jumpIptCls: 'jump-ipt', //文本框內(nèi)容
jumpBtnCls: 'jump-btn', //跳轉按鈕
jumpBtn: '跳轉', //跳轉按鈕文本
callback: function () { 
} //回調
};
var Pagination = function (element, options) {
//全局變量
var opts = options,//配置
current,//當前頁
$document = $(document),
$obj = $(element);//容器
/**
* 設置總頁數(shù)
* @param int page 頁碼
* @return opts.pageCount 總頁數(shù)配置
*/
this.setTotalPage = function (page) {
return opts.pageCount = page;
};
/**
* 獲取總頁數(shù)
* @return int p 總頁數(shù)
*/
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;
};
/**
* 填充數(shù)據(jù)
* @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();//總頁數(shù)
$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內(nèi)容進行分頁顯示,希望對大家有所幫助,如果大家有任何疑問請給我留言,小編會及時回復大家的。在此也非常感謝大家對腳本之家網(wǎng)站的支持!

您可能感興趣的文章:
  • Ajax的使用代碼解析
  • PHP AjaxForm提交圖片上傳并顯示圖片源碼
  • JS 攔截全局ajax請求實例解析
  • Ajax遍歷jSon后對每一條數(shù)據(jù)進行相應的修改和刪除(代碼分享)
  • AJAX工作原理及優(yōu)缺點詳解
  • AngularJS實現(xiàn)ajax請求的方法
  • 使用Ajax生成的Excel文件并下載的實例
  • Ajax的概述與實現(xiàn)過程
  • AJAX請求隊列實現(xiàn)
  • 在Thinkphp中使用ajax實現(xiàn)無刷新分頁的方法
  • jstree創(chuàng)建無限分級樹的方法【基于ajax動態(tài)創(chuàng)建子節(jié)點】
  • JavaScript將base64圖片轉換成formData并通過AJAX提交的實現(xiàn)方法
  • jQuery插件ajaxFileUpload異步上傳文件
  • 淺析Ajax語法

標簽:銅川 內(nèi)江 營口 本溪 益陽 遼寧 四川 玉樹

巨人網(wǎng)絡通訊聲明:本文標題《Ajax讀取txt并對txt內(nèi)容進行分頁顯示功能》,本文關鍵詞  Ajax,讀取,txt,并對,內(nèi)容,;如發(fā)現(xiàn)本文內(nèi)容存在版權問題,煩請?zhí)峁┫嚓P信息告之我們,我們將及時溝通與處理。本站內(nèi)容系統(tǒng)采集于網(wǎng)絡,涉及言論、版權與本站無關。
  • 相關文章
  • 下面列出與本文章《Ajax讀取txt并對txt內(nèi)容進行分頁顯示功能》相關的同類信息!
  • 本頁收集關于Ajax讀取txt并對txt內(nèi)容進行分頁顯示功能的相關信息資訊供網(wǎng)民參考!
  • 推薦文章