当在网页中单击按钮时,如何从列表中显示随机短语?

问题描述 投票:3回答:4

我正在创建一个可供他人访问的网页。他们在字段中键入问题并单击按钮,然后将响应传递回给他们。 (有点像魔术的8号球)。

我想做的就是设置像这样的东西:

http://img585.imageshack.us/img585/997/layoutoi.png

我仍然是手工编写事物的新手-我有一本关于HTML / CSS的书和一本关于PHP的书,至今还没有读过,所以我可能需要一个逐步的过程。 (我有一个主持人,应有尽有,所以已经做好了。)预先感谢!

php javascript html random generator
4个回答
3
投票

要在没有页面加载的情况下执行此操作(即单击按钮后立即执行),您必须使用Javascript(working jsfiddle example here

<a id="myButton" href="#">
    click here to get random stuff
</a>

<div id="myRandomDiv">
</div>

<script type="text/javascript" charset="utf-8">
    var randomStrings = [
        "hello 1",
        "hello 2",
        "hello 3", 
        "hello 4",
        "hello 5",
    ];



    var randomDiv = document.getElementById("myRandomDiv");

    document.getElementById("myButton").addEventListener("click", function() {
          randomIndex = Math.ceil((Math.random()*randomStrings.length-1));
          newText = randomStrings[randomIndex];
          randomDiv.innerHTML = newText;
    });
</script>    

要在PHP中执行此操作(这将需要重新加载页面),可以执行以下操作:

<?php


$randomThings = array(
    'random thing 1',    
    'random thing 2',    
    'random thing 3',    
    'random thing 4',    
    'random thing 5',    
    'random thing 6',    
    'random thing 7 ',    
);

?>




<!-- REST OF YOUR PAGE -->

<?php

echo $randomThings[mt_rand(0,count($randomThings)-1)];

?>

<!-- OTHER STUFF -->

首先,我们创建随机事物的数组('列表')并将其存储在变量$randomThings中。

可以使用$variableName[$index]访问数组中的元素-在这种情况下,索引将只是0、1、2、3、4、5、6。

这种单行代码(以'echo'开头)起作用的原因是,mt_rand将返回0到6之间的随机数,因此它将从$ randomThings数组中获取随机元素。 echo然后将其吐到页面上。


3
投票

Dorkitude的答案是一个很好的例子,但我想指出一点建议,除非绝对没有,通常在脚本中对数据进行硬编码(即$ value ='someValue')是一种不好的做法。反过来。相反,您将使用某种数据源来进行响应(纯文本文件,数据库,Web服务等)。

例如,假设您已将列表存储在名为'randomThings.txt'的纯文本文件中,并将每个响应放在自己的行上。然后,您可以像这样修改Dorkitude的代码:

<?php
    // Flags set here to ensure integrity
    $randomThings = file('responses.txt', FILE_IGNORE_NEW_LINES | FILE_SKIP_EMPTY_LINES);
?>

<!-- REST OF YOUR PAGE -->

<?php

    echo $randomThings[mt_rand(0,count($randomThings)-1)];

?>
<!-- OTHER STUFF -->

2
投票

[我知道您标记了PHP问题,但您可能需要考虑使用javascript。优点是您不需要重新加载页面-对于这种简单的操作,使用php实际上没有任何优势。

一个JavaScript解决方案如下所示:

<html>
  <head>
    <script type='text/javascript'>
      var answerArray = new Array("yes", "no", "maybe");

      function getAnswer() {
        document.getElementById('answerDiv').innerHTML = 
          answerArray[Math.floor(Math.random() * answerArray.length)];
      }
    </script>
  </head>
  <body>
    <input id='questionField' type='text' /><br/>
    <input type='submit' value='Ask Me!' onclick='getAnswer()' />
    <div id='answerDiv'></div>
  </body>
</html>

0
投票

我知道这篇文章很旧,但是有没有办法在中间加上一个单词来挑选两个?例如:“答案1或答案5”。

© www.soinside.com 2019 - 2024. All rights reserved.