我使用PHP MYSQL生成一个小的多页面测验。我可以将问题和多项选择答案显示为单选按钮选项(感谢Stackoverflow的帮助)。我遇到的问题是 - 有没有办法在用户点击单选按钮时立即触发操作?如果用户选择了错误的答案,我想立即给出反馈,并说答案是错误的,为什么会出错。如果用户选择了正确的答案,我想显示正确的答案。
我已经查看了$ _GET,$ _ POST和$ _REQUEST,但所有要求的答案都是“提交”,以便在PHP中开始进程。我想在用户单击单选按钮后立即开始操作(使用PHP源代码)。
注意:我在这里看了几个似乎在上面使用jQuery的问题。没有jQuery或Javascript可以吗?
感谢您的帮助。
答案 0 :(得分:3)
是的,可以使用jQuery是最好的解决方案。
http://api.jquery.com/jQuery.ajax/
<?PHP
if (!empty($_GET['action']) && $_GET['action'] == 'ajax_check') {
// I a final solution you should load here the answer of the question from database by name
$answers = array(
'foo' => 1,
'baa' => 3,
);
// Prepare and default answer in error case
$return = array(
'message' => 'Invalud choise',
);
if (isset($answers[$_GET['name']])) {
// If question/answer was found in database, check if users chouse is correct
if ($answers[$_GET['name']] == $_GET['value']) {
$return['message'] = 'Correct answer';
} else {
$return['message'] = 'Wrong answer';
}
}
// Return answer to java script
header('Content-type: text/json');
echo json_encode($return);
die();
}
?>
Question 1
<input type="radio" name="foo" value="1" class="question_radio" />
<input type="radio" name="foo" value="2" class="question_radio" />
<input type="radio" name="foo" value="3" class="question_radio" />
<input type="radio" name="foo" value="4" class="question_radio" />
<br />
Question 2
<input type="radio" name="baa" value="1" class="question_radio" />
<input type="radio" name="baa" value="2" class="question_radio" />
<input type="radio" name="baa" value="3" class="question_radio" />
<input type="radio" name="baa" value="4" class="question_radio" />
<!-- Load jquery framework from google, dont need to host it by your self -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
// When document was loadet succesfull
$(".question_radio").click(function () {
// Listen on all click events of all objects with class="question_radio"
// It is also possible to listen and input[type=radio] but this can produce false possitives.
// Start communication to PHP
$.ajax({
url: "test.php", // Name of PHP script
type: "GET",
dataType: "json", // Enconding of return values ²see json_encode()
data: { // Payload of request
action: 'ajax_check', // Tel PHP what action we like to process
name: $(this).attr('name'),
value: $(this).val(),
}
}).done(function(data) {
// Procces the answer from PHP
alert( data.message );
});
});
});
</script>
答案 1 :(得分:1)
试试这个
$("input[type='radio'].your_radio_class").bind("change click", function(){
// stopping user from changing the answer further depends on ui specification
// disabling radio
$("input[type='radio'].your_radio_class").each(function(){
$(this).attr({"disabled":true,"readonly":"readoly"});
});
// else show loading graphics
$(this).parent().html("Loading answer...wait");
// make ajax call
// fetch answer
// display answer
});
答案 2 :(得分:0)
你必须考虑的事情是PHP在服务器端运行。有了这个说,你只能通过发送到服务器处理的请求来做到这一点。这是“提交”操作或JQuery / JavaScript / Ajax调用,它们在本地运行,向服务器发出请求,然后更新页面。因此,要使用PHP,您必须提交或使用本地脚本进行呼叫。
答案 3 :(得分:0)
使用javascipt可以做到最好(jQuery对你来说可能更容易)。
1st:您设置了一个click事件,当点击radiobutton时会触发一个动作:
http://api.jquery.com/click/
第二:当触发点击时,你设置一个对php文件的ajax调用,验证输入并返回结果:
http://api.jquery.com/jQuery.ajax/
其余由你决定。
答案 4 :(得分:0)
如果要在实际点击提交按钮之前验证用户选择,则需要使用onchange属性为要验证的单选按钮启动ajax函数(带参数),然后ajax将从服务器获取响应,即你验证用户选择的PHP代码并返回结果。(如果你做对了)