在javascript中从本地文本文件中随机选取一行_Javascript_Html

在javascript中从本地文本文件中随机选取一行

javascript html

在javascript中从本地文本文件中随机选取一行,javascript,html,Javascript,Html,我有一个程序，应该从本地文本文件中随机选取一行，但它似乎不起作用。代码如下： <html> <head> <script src="http://code.jquery.com/jquery-3.3.1.min.js"></script> </head> <body> <h1 id = "gen">Alt Info: </h1> <script> func

我有一个程序，应该从本地文本文件中随机选取一行，但它似乎不起作用。代码如下：

<html>
<head>
    <script src="http://code.jquery.com/jquery-3.3.1.min.js"></script>
</head>
<body>
    <h1 id = "gen">Alt Info: </h1>
    <script>
    function readTextFile(file)
    {
        var rawFile = new XMLHttpRequest();
        rawFile.open("GET", file, false);
        rawFile.onreadystatechange = function ()
        {
            if(rawFile.readyState === 4)
            {
                if(rawFile.status === 200 || rawFile.status == 0)
                {
                    var allText = rawFile.responseText;
                    var split = allText.split('\n')
                    var randomNum = Math.floor(Math.random() * split.length);
                    var randomLine = split[randomNum]
                    console.log("All Lines\n"+allText)
                    console.log("Line Numebr\n"+(randomNum+1))
                    console.log("Random Line\n"+randomLine)
                }
            }
        }
        rawFile.send(null);
    }
    readTextFile("alts.txt");
    </script>
    <button type="button" class=button onclick=document.getElementById("gen").innerHTML = randomLine;>Generate</button>


Alt信息：
函数readTextFile（文件）
{
var rawFile=new XMLHttpRequest（）；
打开（“获取”，文件，错误）；
rawFile.onreadystatechange=函数（）
{
if（rawFile.readyState==4）
{
if（rawFile.status==200 | | rawFile.status==0）
{
var allText=rawFile.responseText；
var split=allText.split（'\n'）
var randomNum=Math.floor（Math.random（）*split.length）；
var randomLine=split[randomNum]
console.log（“所有行\n”+所有文本）
log（“行Numebr\n”+（randomNum+1））
console.log（“随机行\n”+随机行）
}
}
}
rawFile.send（空）；
}
readTextFile（“alts.txt”）；
生成

上面的代码应该从“alts.txt”文本文件中选择一个随机行，然后当单击“生成”按钮时，它应该在屏幕上显示该随机行。相反，当我点击“生成”按钮时，什么也没发生。如果有人能帮助我，那就太棒了

您的

按钮使用的内联处理程序试图引用不在全局范围内的变量
内联事件处理程序本质上是HTML标记内部的eval
——它们是一种不好的做法，会导致代码分解不好，难以管理。认真考虑用JavaScript附加事件，例如：
另一个问题是#showText
不存在-只需从脚本中删除该行即可
你有几个选择。一种是使randomLine
成为一个全局变量，以便按需按钮可以引用该变量-不建议这样做：
<script>
var randomLine;
function readTextFile(file)
  // ...
    var randomNum = Math.floor(Math.random() * split.length);
    randomLine = split[randomNum]

或者，更好的是，根本不创建全局变量；仅在需要的地方定义行，该行位于侦听器内部：
(() => {
  var randomLine;
  var rawFile = new XMLHttpRequest();
  rawFile.open("GET", "alts.txt", false);
  rawFile.onreadystatechange = function() {
    if (rawFile.readyState === 4) {
      if (rawFile.status === 200) {
        var allText = rawFile.responseText;
        var split = allText.split('\n')
        var randomNum = Math.floor(Math.random() * split.length);
        randomLine = split[randomNum]
        console.log("All Lines\n" + allText)
        console.log("Line Numebr\n" + (randomNum + 1))
        console.log("Random Line\n" + randomLine)
      }
    }
  }
  rawFile.send(null);

  const gen = document.getElementById('gen');
  document.querySelector('button').addEventListener('click', () => {
    if (randomLine) gen.textContent = randomLine;
    else gen.textContent = 'Not retrieved yet';
  });
})();

（或者改用fetch和promissions来处理异步性）
似乎不起作用
看到错误了吗？你看过剧本了吗，看它在哪里卡住了？这是第一件要检查的事情，在您提供的HTML中没有id为“showText”的元素。似乎不起作用是一个完全无用的问题描述。具体以什么方式不起作用？别指望我们能读懂你的心思，因为天气条件通常会干扰你的长途旅行。如果你想让我们知道什么，那就把它放在你的问题里。如果您不清楚地解释问题，我们将无法帮助您。很抱歉，我知道我的代码有点混乱，我正在修复它。Ken White很抱歉，让我改变问题，让它变得更好。所以，我猜主持人终于赶上你了。这是一个艰难的教训，但希望是一个很好的教训。我真的希望你在未来的编程工作中好运并取得成功。虽然我想我做到了，但我不知道你还想要什么？如果有错误，请说明它们是什么代码没有看到为我工作？我单击按钮，没有生成任何文本？同样，不起作用没有任何信息-它的哪些部分运行或不运行？错误在哪里？请解释问题当我点击按钮时，它根本不显示任何文本
(() => {
  var randomLine;
  var rawFile = new XMLHttpRequest();
  rawFile.open("GET", "alts.txt", false);
  rawFile.onreadystatechange = function() {
    if (rawFile.readyState === 4) {
      if (rawFile.status === 200) {
        var allText = rawFile.responseText;
        var split = allText.split('\n')
        var randomNum = Math.floor(Math.random() * split.length);
        randomLine = split[randomNum]
        console.log("All Lines\n" + allText)
        console.log("Line Numebr\n" + (randomNum + 1))
        console.log("Random Line\n" + randomLine)
      }
    }
  }
  rawFile.send(null);

  const gen = document.getElementById('gen');
  document.querySelector('button').addEventListener('click', () => {
    if (randomLine) gen.textContent = randomLine;
    else gen.textContent = 'Not retrieved yet';
  });
})();