onClick使用“quotes.txt”中的随机文本行刷新div

-1

我有一个报价生成器，位于http://communitychessclub.com。我希望用户能够点击报价并加载另一个随机报价而不是刷新整个页面。我怎样才能做到这一点？onClick使用“quotes.txt”中的随机文本行刷新div

<h3> 

<?php $randomThings = file('quotes.txt', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES); 
echo $randomThings[mt_rand(0,count($randomThings)-1)];?> 

</h3>

我试图科林shoens建议下面：

<div id="new-projects"></div> 
<script> 
$("#new-projects").load("quotes.txt"); 
</script>

但它装的不是一个单一的随机报价均为307个报价。

http://communitychessclub.com/test.php

我该如何解决这个问题？

来源

2015-03-31 verlager

使用JavaScript。 – Mathemats 2015-03-31 23:49:29

有多少报价？你能用上面的代码制作一个专用的quotes.php吗？ – Drakes 2015-03-31 23:56:30

我有307个引号。是的，我可以使用PHP来回显并运行上面的代码。 – verlager 2015-04-01 00:14:52

您提到您有超过300个引号，因此客户端页面上的内联JS引号数组可能无效。下面是使用jQuery和PHP一个快速的解决方案：

PHP - quotes.php

<?php 
    // This is your original PHP code, mostly 
    $randomThings = file('quotes.txt', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES); 
    echo $randomThings[mt_rand(0,count($randomThings)-1)]; 
?>

HTML侧

<H3 id="new-projects"></H3> 
<script> 
    $("#new-projects").on("click", function(){ 
     $(this).load("quotes.php"); 
    }); 
</script>

来源

2015-04-01 07:26:37 Drakes

太棒了！完美工作！非常感谢！ – verlager 2015-04-01 18:22:56

您将需要使用代表异步JavaScript和XML的AJAX。您可以使用jQuery库来减少所需的代码量，以便异步加载新内容。看一看jQuery的文档：

https://api.jquery.com/load/

来源

2015-03-31 23:49:24

响应更快的方式是，当用户打开页面加载整个文件，只是有行是一个数组。然后，您可以使用JavaScript来更改基于该数组的div，您永远不必刷新页面，甚至可以使用AJAX与服务器联系。

来源

2015-03-31 23:51:10 vkapadia

onClick使用“quotes.txt”中的随机文本行刷新div

回答

相关问题