简体   繁体   English

jquery-function 不显示任何内容

[英]jquery-function doesn't show anything

I'm trying to create a random generator and on another page if found a hint, that this would be easy using jQuery, so I tried the following.我正在尝试创建一个随机生成器,如果在另一页上找到提示,使用 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>

it should work like this: it loads a document with several lines of text ans splits it up at line break.它应该像这样工作:它加载一个包含几行文本的文档,然后在换行符处将其拆分。 this should be stored in an array and a random line should be displayed on the website.这应该存储在一个数组中,并且应该在网站上显示随机行。

My first idea was to write the text directly into an array but I thought loading it would be more efficient for the website.我的第一个想法是将文本直接写入数组,但我认为加载它对网站来说会更有效率。

Thanks for answering谢谢回答

PS: there isn't a error-message like "Error on this page" when the browser runs it. PS:浏览器运行时不会出现“本页错误”之类的错误信息。

Final Edit :最终编辑

Thanks for helping.!!感谢您的帮助。 Now it works.现在可以了。

Here's the solution:这是解决方案:

<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>

You need to put document.write() inside your function(msg) as AJAX is asynchronous and load is using AJAX, so document.write() doesn't wait until load is finished calling your anonymous function您需要将document.write()放入您的function(msg)中,因为 AJAX 是异步的并且load正在使用 AJAX,因此document.write()不会等到load完成后调用您的匿名 function

   $(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>');
    });
   });

EDIT:编辑:

I've just noticed you haven't included your jquery library o_O我刚注意到你没有包括你的 jquery 库 o_O

Add the following above your <script>在您的<script>上方添加以下内容

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

NiftyDude is right that you've put your document.write call outside the scope of your document.ready function. Also: NiftyDude 是正确的,您已将 document.write 调用放在 document.ready function 的 scope 之外。另外:

  • It's also almost always a bad idea to use document.write.使用 document.write 几乎总是一个坏主意。 In this case you're waiting for an AJAX call to complete before using it, which means you're guaranteeing the document.write will overwrite the entire page body.在这种情况下,您在使用它之前等待 AJAX 调用完成,这意味着您保证 document.write 将覆盖整个页面主体。
  • You're using $('body').load, which is inappropriate in this case--you'll be adding text to the body manually.您正在使用 $('body').load,这在这种情况下是不合适的——您将手动向正文添加文本。

Here's a fix:这是一个修复:

<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>

Try this alternate solution试试这个替代解决方案

$(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>');
        }
    });
});

Also make sure you have included the jquery file.还要确保您包含了 jquery 文件。

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM