PHP根据正确或不正确的答案更改背景颜色


PHP Change background color, based on correct or incorrect answer

因此,我正在开发一个网站,您可以在该网站上教授新商务人员一些我们需要了解的代码。这是在网站上:一张表格中的表格,你必须在输入字段中写下某些水果、蔬菜和面包的正确代码(超市的东西…)。

像这样:图片-黄瓜-在这里填写代码

最后,检查您是否填写了正确的代码。但我希望输入字段改变颜色,如果答案正确,则为绿色,如果答案错误,则为红色。

这就是我得到的:

Index.html:

//Above here is the table
<?php
    if(isset($_POST['komkommer'])){
        /* Include PHP scripts first */
        include_once 'phpscripts/plu.php';
        include_once 'phpscripts/groentestore.php';
        include_once 'phpscripts/functions.php';
        /* Call the check functions */
        groenteCheck();
    }
    else {
    }
?>

表格的一部分(在index.php中,从外部php文件加载):

<tr>
    <td><img src="image/komkommer.jpg"></td>
    <td>Komkommer</td>
    <td><input type="text" autocomplete="off" name="komkommer" placeholder="..."></td>
</tr>
<tr>
    <td><img src="image/rodekool.jpg"></td>
    <td>Rode kool</td>
    <td><input type="text" autocomplete="off" name="rodekool" placeholder="..."></td>
</tr>

和functions.php 中groenteCheck()的一部分

if($komkommer != $plu_komkommer){
        echo '<p>Komkommer was niet juist! Jij voerde '.$komkommer.' in!</p>';
    }
    if($rodekool != $plu_rodekool){
        echo '<p>Rode kool was niet juist! Jij voerde '.$rodekool.' in!</p>';
    }

我试着:1.在index.html中创建一个名为$komkomerCheck的PHP变量,并将其设置为"标准"。在表中添加了以下内容:class=<?php echo '"'.$komkommerCheck.'"';?>>.然后,在if-else语句中,我设置:$komkomerCheck="correct"或$komkommerCheck="error"('rong'和'correct'是两个类,使背景颜色为红色或绿色)。但是一旦检查完成,就会出现消息"'<p>Komkommer was niet juist! Jij voerde '.$komkommer.' in!</p>';",但该类在index.php中没有更改

如果这有点不清楚,我很抱歉,但我们非常感谢您的帮助!

谢谢:)

如果你想用PHP更改输入颜色,这显然只会在服务器端发生,也就是说在你提交表单之后。如果你想在他们输入时检查输入是否正确,那么你需要使用JavaScript。这是一个给你的例子,请投票,因为我是为你编码的。

http://jsfiddle.net/qhdsk784/1/

JS此处

$( document ).ready(function() { 
    $( "#carr" ).keyup(function() {
    var get_value = $("#carr").val();
            if(get_value == "stephen"){
        $("#carr").addClass('green');
    }
});  
    });

HTML此处

<div>Enter <b>stephen</b> into the input to see change.</div>
 <input type="text" name="carr" id="carr"value="">

CSS此处

input{
    color:#fff;
    font-weight:bold;
    padding:7px;
    font-size:16px;
    background-color:#FA0000;
}
input.green{
    background-color:#479E00;
    color:#fff;
    font-weight:bold;
}