[英]slideup function does not works with dynamic questions (static are ok)
This is the script that checks the radio being clicked to compare with result and slide up: 这是一个脚本,用于检查被单击的广播与结果进行比较并向上滑动:
<script>
$(document).ready(function(){
$("input:radio").change(function(){
checkResult(this);
});
});
function checkResult(el)
{
//get the radio button value
var clickedvalue=$(el).val() ;
$this=$(el).parent("div.QA");
var hiddenanswer=$this.find(".hidden_result").val();
//call to next function to check result
var report=checkAnswer(clickedvalue,hiddenanswer);
if(report)
{
$this.find(".report").html("correct");
}
else{
$this.find(".report").html("Incorrect");
}
function checkAnswer(click,answer){
if(click==answer){
return true;
}
else{
return false;
}
}
$this.delay(500).slideUp();
}
</script>
This is PHP to fetch questions and options from the database. 这是PHP,用于从数据库中获取问题和选项。 I have used timestamp as
name
to make the name different for each questions (radio) . 我已经使用时间戳作为
name
以使每个问题(无线电)的名称都不同。
<?php
$dbconnect=mysqli_connect('localhost','root','','quiz')or die("Error Connecting to database"); $query="select * from question_answer ";
$result=mysqli_query($dbconnect,$query);
?>
<form method="get" action="">
<div id="container">
<?php
while($rows=mysqli_fetch_array($result))
{
echo '<div class="QA">';
echo '<h1>'.$rows['question'].'</h1>'.'<br/>';
echo '<input type="radio" class="check" name="'.$rows['radioname'].'" value="A">'.$rows['option1'].'</input>';
echo '<input type="radio" class="check" name="'.$rows['radioname'].'" value="A">'.$rows['option2'].'</input>';
echo '<input type="radio" class="check" name="'.$rows['radioname'].'" value="A">'.$rows['option3'].'</input>';
echo '<input type="radio" class="check" name="'.$rows['radioname'].'" value="A">'.$rows['option4'].'</input>';
echo '<br/>';
echo '<div class="report"></div>';
echo'</div>';
}
?>
</div>
</form>
Now that I have indented your code properly, I can see that you are missing a closing }
for your CheckResult function. 既然我已经正确缩进了您的代码,我可以看到您缺少CheckResult函数的
}
。
function checkResult(el)
{
...
else{
$this.find(".report").html("Incorrect");
}
} // <- this is missing!
It's a good idea to indent your code because it makes it much easier to read and find bugs like this. 缩进代码是个好主意,因为这样可以使阅读和查找类似的错误变得更加容易。 I would also be consistent in how you place your opening and closing braces - pick a style and stick with it.
在您放置左括号和右括号时,我也会保持一致-选择样式并坚持使用。 I don't know if this is still the case, but JavaScript is more efficient when you place your opening braces at then end of a line like this:
我不知道这种情况是否仍然存在,但是当您将开括号放在行的末尾时,JavaScript效率更高:
function checkResult(el){
//get the radio button value
var clickedvalue = $(el).val();
$this = $(el).parent("div.QA");
var hiddenanswer = $this.find(".hidden_result").val();
//call to next function to check result
var report = checkAnswer(clickedvalue,hiddenanswer);
if(report){
$this.find(".report").html("correct");
}else{
$this.find(".report").html("Incorrect");
}
}
Another tip, you can simplify your checkAnswer function by doing this: 另一个技巧是,您可以通过执行以下操作简化checkAnswer函数:
function checkAnswer(click,answer){
return (click==answer); // this will return true or false
}
But depending on what the values ranges for click and answer are, you will probably want to make this more robust and check for invalid values. 但是,取决于单击和回答的值范围是什么,您可能需要使其更加健壮并检查无效值。
I would also encourage you to research the heredoc syntax in PHP - it's a great way to handle long strings, especially if they have both single and double quotes in them. 我也鼓励您研究PHP中的Heredoc语法-这是处理长字符串的好方法,尤其是当它们中包含单引号和双引号时。 Here's a S/O question about it.
这是关于它的S / O问题 。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.