Question

我正在尝试创建一个随机生成器，如果找到一个提示，在另一个页面上，这将很容易使用jQuery，所以我尝试了以下。

<html>
 <head>
  <title>hello</title>
 </head>
 <body>
  <script type="text/javascript">
   $ (document).ready(function() {
    $("body").load("hello.txt", function(msg) {
        var textArray = msg.split("\n");
    var zufall = Math.round ( ( textArray.length - 1 ) * ( Math.random() ) );
    });
   });
   document.write('<p>' + textArray[zufall] + '</p>');
  </script>
 </body>
</html>

它应该像这样工作：它加载一个带有几行文本的文档，并在换行时将其拆分。这应该存储在一个数组中，随机行应该显示在网站上。

我的第一个想法是将文本直接写入数组，但我认为加载它会对网站更有效。

感谢您的回答

PS：当浏览器运行时，没有类似“此页面上的错误”的错误消息。

最终修改：

感谢您的帮助！现在它有效。

以下是解决方案：

<html>
    <head>
        <title>hello</title>
    </head>
    <body>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
            <script type="text/javascript">
            $ (document).ready(function() {
                 $.get("hello.txt", function(msg) {
                    var textArray = msg.split("\n");
            var zufall = Math.round ( ( textArray.length - 1 ) * ( Math.random() ) );

            $('body').append('<p>' + textArray[zufall] + '</p>');
                });
            });
        </script>
    </body>
</html>

Answer 1

您需要将document.write()放在function(msg)内，因为AJAX是异步的，load正在使用AJAX，所以document.write()不会等到load完成了你的匿名功能调用

   $(document).ready(function() {
    $.get("hello.txt", function(msg) {
        var textArray = msg.split("\n");
        var zufall = Math.round ( ( textArray.length - 1 ) * ( Math.random() ) );
        $('body').append('<p>' + textArray[zufall] + '</p>');
    });
   });

编辑：

我刚刚注意到你没有包含你的jquery库o_O

在<script>

上方添加以下内容

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>

Answer 2

NiftyDude是对的，你已经将document.write调用放在document.ready函数的范围之外。也：

使用document.write几乎总是一个坏主意。在这种情况下，您在使用之前等待AJAX调用完成，这意味着您要保证document.write将覆盖整个页面主体。
您正在使用$（'body'）。load，在这种情况下不合适 - 您将手动向正文添加文本。

这是一个修复：

<html>
 <head>
  <title>hello</title>
 </head>
 <body>>
  <script type="text/javascript" src="jquery.js"></script>
  <script type="text/javascript">
   $(document).ready(function() {
    $.get("hello.txt", function(msg) {
        var textArray = msg.split("\n");
        var zufall = Math.round ( ( textArray.length - 1 ) * ( Math.random() ) );
        $('body').append('<p>' + textArray[zufall] + '</p>');
    });
   });
  </script>
 </body>
</html>

Answer 3

尝试此备用解决方案

$(document).ready(function() {
    $.ajax({ 
        url: "hello.txt",
        type: "GET",
        dataType: "text",
        success: function(data) {
            textArray = data.split("\n");
            zufall = Math.round ( ( textArray.length - 1 ) * ( Math.random() ) );
             document.write('<p>' + textArray[zufall] + '</p>');
        }
    });
});

还要确保已包含jquery文件。

jquery-function没有显示任何内容

3 个答案: