[英]Load .txt file using JQuery or Ajax
如何修复下面的脚本,以便它可以每次都工作! 有时它会起作用,有时则不起作用。 Pro JQuery解释了导致这种情况的原因,但它没有讨论如何修复它。 我几乎肯定它与ajax就绪状态有关,但我不知道如何写它。 网络显示了大约99种不同的方式来编写ajax和JQuery,它有点压倒性。
我的目标是创建一个HTML shell,可以使用基于服务器的文本文件填充文本。 例如:假设在名为AG的服务器上有一个文本文件,其内容为PF:PF-01,PF-02,PF-03等。我想提取此信息并填充HTML DOM之前用户看到。 A是@#!#$ *&Golden with PHP,然后发现我的主机已关闭fopen()。 所以我在这里。
谢谢你的帮助。
JS - plantSeed.js
var pageExecute = {
fileContents:"Null",
pagePrefix:"Null",
slides:"Null",
init:function () {
$.ajax({
url: "./seeds/Ag.txt",
success: function (data){
pageExecute.fileContents = data;
}
});
}
};
HTML - HEAD
<script type="text/javascript">
pageExecute.init();
</script>
HTML - BODY
<script type="text/javascript"> alert(pageExecute.fileContents); </script>
试试这个:
var pageExecute = {
fileContents:"Null",
pagePrefix:"Null",
slides:"Null",
init: function () {
$.ajax({
url: "./seeds/Ag.txt",
async: false,
success: function (data){
pageExecute.fileContents = data;
}
});
}
};
试试这个:
HTML:
<div id="target"></div>
JavaScript的:
$(function(){
$( "#target" ).load( "pathToYourFile" );
});
在我的例子中,div将填充文件内容。 看一下jQuery .load()
函数。
“pathToYourFile”可以是包含您要加载的数据的任何资源。 有关如何使用它的更多信息,请查看加载方法文档。
使用$.get()
函数 :
$(function(){
$.get( "pathToYourFile", function( data ) {
var resourceContent = data; // can be a global variable too...
// process the content...
});
});
使用$.ajax()
函数 :
$(function(){
$.ajax({
url: "pathToYourFile",
async: false, // asynchronous request? (synchronous requests are discouraged...)
cache: false, // with this, you can force the browser to not make cache of the retrieved data
dataType: "text", // jQuery will infer this, but you can set explicitly
success: function( data, textStatus, jqXHR ) {
var resourceContent = data; // can be a global variable too...
// process the content...
}
});
});
重要的是要注意:
$(function(){
// code...
});
是相同的:
$(document).ready(function(){
// code
});
通常您需要使用此语法,因为您希望DOM已准备好执行您的JavaScript代码。
这是你的问题:你的主体中有一个脚本标记,它要求输入AJAX数据。 即使你要求它将数据写入你的shell,而不是只是喷出它......这是你的第一个问题。
原因如下:
AJAX是异步的。 好的,我们已经知道了,但这意味着什么?
嗯,这意味着它将转到服务器并要求提供文件。 服务器将继续查找,并将其发送回去。 然后你的电脑将下载内容。 当内容100%下载时,它们将可供使用。
......事情是......
你的程序不是在等待这种情况发生。 它告诉服务器花时间,同时它会继续做它正在做的事情,并且它不会再考虑内容,直到它从服务器接到电话。
嗯,在渲染HTML时,浏览器真的很快。 服务器在提供静态(纯文本/ img / css / js)文件时也非常快。
所以现在你正在参加比赛。 哪个会先发生? 服务器是否会使用文本回调,或者浏览器是否会点击要求提供文件内容的脚本标记?
无论哪一个在刷新上获胜都是将要发生的。
那你怎么解决这个问题呢? 回调。
回调是一种不同的思维方式。 在JavaScript中,通过在下载完成时为AJAX调用提供要使用的函数来执行回调。
这就像是从工作线上打电话给某人,然后说:当你得到我的回答时,拨打这个扩展来联系我。
在jQuery中,您将在AJAX调用中使用名为“success”的参数。 success : function (data) { doSomething(data); }
success : function (data) { doSomething(data); }
您传递到AJAX调用该对象的一部分。 当文件下载时,一旦下载,jQuery就会将结果传递给你给它的成功函数,它将完成它所做的任何事情,或调用它所调用的任何函数。
试试看。 它肯定胜过赛车,看看哪个下载首先。
我建议不要使用url: "./seeds/Ag.txt",
直接定位文件。 相反,使用服务器端脚本llike PHP打开文件并以平面格式或JSON格式返回数据。
您可以在此处找到打开文件的教程: http : //www.tizag.com/phpT/fileread.php
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.