使用 jquery 或 javascript 重新加载 div 或脚本而不是页面的随机按钮答案

【问题标题】：Random button that reload a div or script not page using jquery or javascript使用 jquery 或 javascript 重新加载 div 或脚本而不是页面的随机按钮
【发布时间】：2016-05-15 17:28:48
【问题描述】：

我真的很陌生，我需要在我的页面上添加一个随机按钮，每次有人点击随机按钮时，它都会在 div 中显示新的一行信息。我还想知道是否有超过 800 行，是否可以将其作为 txt 或 html 放在外部文件中。

这是我到目前为止所得到的，它不起作用，我越来越困惑......请帮助

<script type="text/javascript" src="jquery-2.2.0.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
        $('#text').hide();

        $('a#random').click(function(){
            $('#text').toggle();
        })

        function RndText() {
            var rannum= Math.floor(Math.random()*textarray.length);
            document.getElementById('#text').innerHTML=textarray[rannum];
        }
        var textarray = [
         "Hello",
         "How are you",
         "Good Bye"    
        ];
        $("#text").load()
    })
</script>

<body>
    <div id="text">Line to Show</div>
    <a href="#" id="random">RANDOM</a>
</body>

【问题讨论】：

Javascript 本身没有创建文件的能力。您需要找到一个服务或创建一个可以让您制作文件的服务。然后您必须将所有数据发布到该服务。
谢谢，所以我需要在我的 textarray 中包含每一行，以便它们出现我假设
类似这样的东西：jsfiddle.net/Lwexjdj2
在RndText函数中，指令document.getElementById('#text').innerHTML=textarray[rannum];不刷新文本。您可以将其替换为 $('#text').html(textarray[rannum]);

标签： javascript jquery html random

【解决方案1】：

呃。差不多就是这样：

$('a#random').click(function(){
    $('#text').toggle();
    RndText();  //you're good
});

虽然我会指出 RndText() 在可以使用 $("#text") 时使用 document.getElementById。（有一个 .html() 方法将写入值而不是 .innerHTML 属性）。

document.getElementById 当前也无法正常工作，因为您使用“#text”而不是“text”，jQuery 使用 CSS 选择器，getElementById 没有。

【讨论】：

【解决方案2】：

当你点击随机按钮时添加RndText的执行。

$('a#random').click(function(){
  $('#text').show();
  RndText();
})

【讨论】：

天哪，它的工作原理！！！！这太酷了！非常感谢，我已经尝试了这么多小时

【解决方案3】：

这将为您提供一个按钮，您可以通过单击下面的按钮来运行此代码。但是，我不太明白问题的第二部分：单独文件中的 800 行，你想用它做什么？告诉我，这样我就可以更进一步地向你致敬......

已编辑：

<?php
$data = file_get_contents('demo.txt');
$lines= split("\n",$data);
?>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>

<script type="text/javascript">
	var textarray = <?php echo json_encode($lines); ?>;

	function RndText() {
	    var rannum= Math.floor(Math.random()*textarray.length);
	    $('#text').text(textarray[rannum]);
	    console.log(textarray[rannum]+"  "+rannum+" "+textarray.length);
	}

	$(document).ready(function(){
	    $('#text').hide();

		$('#random').click(function(){
	    	$('#text').show();
	    	RndText();
		});
	});

</script>

<body>

<div id="text"></div>
<button id="random">RANDOM</button>

</body>

【讨论】：

textarray 将有超过 800 行随机数，所以我想知道是否有任何方法可以将所有这些行放在另一个文档中，以便更容易不必直接将其放入脚本中
您必须使用 PHP 或其他一些 JavaScript 库来为您提供文件中的数据。也知道使用 PHP 或类似的 JS 库可能需要 Web 服务器的代码。这是因为浏览器限制任何网站更改最终用户文件或从用户计算机读取任何数据。因此，为了用户的安全，浏览器基本上不允许使用 JS 进行任何类型的读取或写入操作。如果您想知道该代码，请告诉我。相信我，这会很简单。
我尝试使用测试服务器设置我的网站，但一直收到错误消息，但是当网站启动并运行时，改用 PHP 可能是个好主意，我如果您不介意，可以尝试使用您的代码
@MelissaBerry 查看更新后的代码。这应该够了吧。确保 Demo.txt 文件位于同一目录中。您可以在文本文件中放置任意数量的内容。如果您想知道它是如何工作的，请告诉我... !!!干杯！！！ :D