我试图在每次加载我的页面时加载一个随机标题。我有一个单独的文本文件,每一行都包含一个字符串。如您所见,我对 html 和 Javascript 都不熟悉。
HTML:
<div class="centerpiece">
<h1>DEL NORTE BANQUEST</h1>
<p class="caption"><script src = "js/caption.js"></script><script>getCaption();</script></p>
<a class="btn" id="browse-videos-button" href="#video-list">Browse Videos<br><img src="img/arrow-down.svg"style="width:15px;height:15px;"></a>
</div>
Javascript:
function getCaption()
{
var txtFile = "text/captions.txt"
var file = new File(txtFile);
file.open("r"); // open file with read access
var str = "";
var numLines = 0; //to get the range of lines in the file
while (!file.eof)
{
// read each line of text
numLines += 1;
}
file.close();
file.open("r");
var selectLine = Math.getRandomInt(0,numLines);//get the correct line number
var currentLine = 0;
while(selectLine != currentLine)
{
currentLine += 1;
}
if(selectLine = currentLine)
{
str = file.readln();
}
file.close();
return str;
}
源文件中的文本:
We talked yesterday
Freshman boys!
5/10
I'm having a heart attack *pounds chest super hard
该网站是为我的高中越野队准备的,以防文本文件令人困惑。
我不熟悉大多数语法,无法通过循环遍历文件来判断是否需要以某种方式重置,这就是我打开和关闭文件两次的原因。这是我要更改的特定标题的 jsfiddle 以及我在 Javascript 中的功能。
https://jsfiddle.net/7cre9qqj/
如果您需要更多代码,请告诉我,如果您有任何批评,如果它看起来一团糟,请不要犹豫,毕竟我正在努力学习!感谢您的帮助!
最佳答案
File
API允许在客户端 端访问文件系统,因此它不太适合您想要执行的操作。它也只允许在非常特殊的情况下使用。
一个简单的解决方案是运行一个 AJAX 请求来填充您的报价。 AJAX 调用可以读取您服务器上的文件,然后很简单地按行拆分文件的内容,并选择一个随机行来显示。由于您对 jQuery 持开放态度,因此代码非常简单:
$.get("text/captions.txt")).then(function(data) {
var lines = data.split('\n');
var index = Math.floor(Math.random() * lines.length);
$("#quote").html(lines[index]);
});
这是一个完整演示它的 fiddle ;每次运行时都会加载一个随机报价:https://jsfiddle.net/s1w8x4ff/
关于javascript - 使用 Javascript 从文本文件加载随机字幕并通过 HTML 显示,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38582125/