Я работаю над приложением для викторины, которое позволит пользователю ввести вопрос викторины с четырьмя возможными ответами. Они должны выбрать, какой ответ будет правильным с помощью переключателя. Затем мне нужно отображать ответы в случайном порядке, причем правильный цвет отличается от остальных. В настоящее время я могу отображать ответы в произвольном порядке, но я не знаю, как сделать ответ, который был выбран с помощью переключателя другого цвета. Вот как это выглядит …
И это страница результатов …
Как вы можете видеть, результаты отображаются в случайном порядке, и это то, что я хочу. Как изменить цвет «Олбани» на странице результатов, чтобы показать, что это правильный ответ?
Вот мой код формы ….
<form style="text-align:center" action="QuestionReview.php" method="POST"> <br> <label class="instructions" for="question" >Enter your question here</label><br> <textarea name="question" rows="5" cols="40"></textarea> <br><br> <p class="instructions"> Please provide four answers to your question and select the correct one. </p> <input type="radio" name="selection" value="answerA"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="radio" name="selection" value="answerB"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="radio" name="selection" value="answerC"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="radio" name="selection" value="answerD"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="submit" value="Submit Entry"> </form>
И вот страница результата …..
<?php // Retrieve the question and answers from the HTML form $question = $_POST['question']; $answers = $_POST['answer']; $selection = $_POST['selection']; shuffle($answers); ?> <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Entry Review</title> <style> .instructions { color: #696D6E; } </style> </head> <body> <h1 class="instructions">Entry Review</h1> <p><em>You entered the following question:</em></p> <p><strong><?php echo $question; ?></strong></p><br> <p><em>These are the answers you provided:</em> <p> <strong> <?php foreach($answers as $value) { echo $value . '<br>'; } ?> </strong> </p> </body> </html>
Вы можете обернуть каждый ответ в <div>
-s и добавить к ним стиль только в том случае, если они были выбраны.
Рекомендуется изменить имена полей ввода в вашей форме из selection
и answer[]
чтобы answer[selected]
и answer[body]
соответственно. Это позволяет группировать тело и показатель правильности ответа. Теперь вы можете изменить свой foreach
следующим образом:
<?php foreach($answers as $answer){ // Print div with style, if this answer is correct $answer['selected'] ? print '<div style="color:green;">' : print '<div>'; echo $answer['body'] echo '</div>' } ?>
<input type="radio" name="answer[0][selected]" value="true"> <input type="text" name="answer[0][body]" style="width:400px"> <br><br> <input type="radio" name="answer[1][selected]" value="true"> <input type="text" name="answer[1][body]" style="width:400px"> <br><br> <input type="radio" name="answer[2][selected]" value="true"> <input type="text" name="answer[2][body]" style="width:400px"> <br><br> <input type="radio" name="answer[3][selected]" value="true"> <input type="text" name="answer[3][body]" style="width:400px"> <br><br>
<?php // Retrieve the question and answers from the HTML form $question = $_POST['question']; $answers = $_POST['answer']; shuffle($answers); ?> // . . . <?php foreach($answers as $answer){ // Print div with style, if this answer is correct $answer['selected'] ? print '<div style="color:green;">' : print '<div>'; echo $answer['body'] echo '</div>' } ?>
PS
Обязательно избегайте пользователям данных, прежде чем использовать их!
Вы можете изменить свои поля ввода, как показано ниже:
<input type="radio" name="selection" value="answer0"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="radio" name="selection" value="answer1"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="radio" name="selection" value="answer2"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="radio" name="selection" value="answer3"> <input type="text" name="answer[]" style="width:400px"> <br><br> <input type="submit" value="Submit Entry">
Затем вы можете изменить свой PHP-код (часть foreach), как показано ниже:
<?php foreach($answers as $key=>$value) { if($selection == "answer$key"){ echo "<span style='color:green'>".$value . "</span><br>"; }else{ echo $value."<br>"; } } ?>