Как отобразить случайную фразу из списка при нажатии кнопки на веб-странице? - PullRequest
3 голосов
/ 19 января 2011

Я создаю веб-страницу, где кто-то может ее посетить.Они вводят вопрос в поле и нажимают кнопку, и ответ передается обратно им.(Вроде как волшебный шар 8).

Я пытаюсь сделать что-то вроде этого:

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

Я все ещеновичок в ручном кодировании - у меня есть книга по HTML / CSS и одна по PHP, которая еще не прочитана, поэтому мне, вероятно, потребуется пошаговый процесс.(У меня есть хозяин и все, так что об этом уже позаботились.) Заранее спасибо!

Ответы [ 3 ]

3 голосов
/ 19 января 2011

Ответ Dorkitude - хороший пример, но в качестве дополнительного совета я хотел бы отметить, что обычно жестко кодировать данные внутри ваших сценариев (то есть $ value = 'someValue'), если нет абсолютно другого пути нет. Вместо этого вместо ответов вы должны использовать какой-либо источник данных (простой текстовый файл, базу данных, веб-сервис и т. Д.).

Например, допустим, вы сохранили свой список в текстовом файле с именем 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 -->
3 голосов
/ 19 января 2011

Чтобы сделать это без загрузки страницы (т.е. сразу после нажатия кнопки), вам придется сделать это в Javascript ( рабочий пример jsfiddle здесь )

<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 затем плюет на страницу.

2 голосов
/ 19 января 2011

Я знаю, что вы пометили вопрос 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>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...