创建复选框以更改输出文本颜色

时间：2017-02-10 18:40:25

标签： php html checkbox

有没有办法为红色和＆amp;创建一个复选框？绿色，使输出文本颜色？现在我有两个输入框，一个红色和一个绿色，我可以添加一个复选框，而不是输出应该是哪种颜色。

这是我现在所拥有的。

    <!doctype html>
    <head>
    <title>Hospital Info</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" href="ds.css" />
    </head>

    <body>

<br />
<br />
    <center><h1>Hospital Info</h1></center>



<div id="page-wrap">
    <form method="post" action="ds.php">


                <label for="CLABSI_GREEN"><font color="green">CLABSI</font>                         <br></label>
                <textarea class="main" name="CLABSI_GREEN"></textarea>

                <label for="CLABSI_RED"><font color="red">CLABSI</font><br></label>
                <textarea class="main" name="CLABSI_RED"></textarea><BR><BR>    <BR>



                <label for="FWI_GREEN"><font color="green">Fall With Injury:</font><br></label>
                <textarea class="main" name="FWI_GREEN"></textarea>

                <label for="FWI_RED"><font color="red">Fall With Injury:</font><br></label>
                <textarea class="main" name="FWI_RED"></textarea><BR><BR><BR>



                <label for="HAUTI_GREEN"><font color="green">HAUTI:</font><br></label>
                <textarea class="main" name="HAUTI_GREEN"></textarea>

                <label for="HAUTI_RED"><font color="red">HAUTI:</font><br>    </label>
                <textarea class="main" name="HAUTI_RED"></textarea><BR><BR><BR>




                <label for="HAP_GREEN"><font color="green">HAP:</font><br></label>
                <textarea class="main" name="HAP_GREEN"></textarea>

                <label for="HAP_RED"><font color="red">HAP:</font><br></label>
                <textarea class="main" name="HAP_RED"></textarea><BR><BR><BR>




                <label for="POI_GREEN"><font color="green">Post-Op Infection:</font><br></label>
                <textarea class="main" name="POI_GREEN"></textarea>

                <label for="SSI_RED"><font color="red">Post-Op Infection:</font><br></label>
                <textarea class="main" name="POI_RED"></textarea><BR><BR><BR>




                <label for="CDIFF_GREEN"><font color="green">C-DIFF:</font><br></label>
                <textarea class="main" name="CDIFF_GREEN"></textarea>

                <label for="CDIFF_RED"><font color="red">C-DIFF:</font><br></label>
                <textarea class="main" name="CDIFF_RED"></textarea><BR><BR><BR>



                <label for="WOUND_GREEN"><font color="green">Wound Dehiscence:</font><br></label>
                <textarea class="main" name="WOUND_GREEN"></textarea>

                <label for="WD_RED"><font color="red">Wound Dehiscence:</font><br></label>
                <textarea class="main" name="WOUND_RED"></textarea><BR><BR><BR>



                <label for="PI_GREEN"><font color="green">PI:</font><br></label>
                <textarea class="main" name="PI_GREEN"></textarea>

                <label for="PI_RED"><font color="red">PI:</font><br></label>
                <textarea class="main" name="PI_RED"></textarea><BR><BR><BR>



                <label for="APAL_GREEN"><font color="green">Accidental Punctures/Lacs:</font><br></label>
                <textarea class="main" name="APAL_GREEN"></textarea>

                <label for="APAL_RED"><font color="red">Accidental Punctures/Lacs:</font><br></label>
                <textarea class="main" name="APAL_RED"></textarea><BR><BR><BR>



                <label for="MRSA_GREEN"><font color="green">MRSA:</font><br></label>
                <textarea class="main" name="MRSA_GREEN"></textarea>

                <label for="MRSA_RED"><font color="red">MRSA:</font><br></label>
                <textarea class="main" name="MRSA_RED"></textarea><BR><BR><BR>



                <label for="IP_GREEN"><font color="green">Iatrogenic Pneumothorax:</font><br></label>
                <textarea class="main" name="IP_GREEN"></textarea>

                <label for="IP_RED"><font color="red">Iatrogenic Pneumothorax:</font><br></label>
                <textarea class="main" name="IP_RED"></textarea><BR><BR><BR>



                <label for="S_GREEN"><font color="green">Sepsis:</font><br></label>
                <textarea class="main" name="S_GREEN"></textarea>

                <label for="S_RED"><font color="red">Sepsis:</font><br></label>
                <textarea class="main" name="S_RED"></textarea><BR><BR><BR>



                <label for="VTE_GREEN"><font color="green">VTE:</font><br></label>
                <textarea class="main" name="VTE_GREEN"></textarea>

                <label for="VTE_RED"><font color="red">VTE:</font><br></label>
                <textarea class="main" name="VTE_RED"></textarea><BR><BR><BR>





<div id="contact-area">

                    <input type="submit" name="submit" value="Submit"     class="submit-button" />

        </form>
</div>
</div>
    <div style="clear: both;"></div>
</div>  


</body>
</html>

我的ds.php文件：

<?php
$CLABSI_GREEN = $_POST['CLABSI_GREEN'];
$FWI_GREEN = $_POST['FWI_GREEN'];
$HAUTI_GREEN = $_POST['HAUTI_GREEN'];
$HAP_GREEN = $_POST['HAP_GREEN'];
$POI_GREEN = $_POST['POI_GREEN'];
$CDIFF_GREEN = $_POST['CDIFF_GREEN'];
$PI_GREEN = $_POST['PI_GREEN'];
$APAL_GREEN = $_POST['APAL_GREEN'];
$MRSA_GREEN = $_POST['MRSA_GREEN'];
$IP_GREEN = $_POST['IP_GREEN'];
$S_GREEN = $_POST['s_GREEN'];
$VTE_GREEN = $_POST['VTE_GREEN'];
$WOUND_GREEN = $_POST['WOUND_GREEN'];
$CLABSI_RED = $_POST['CLABSI_RED'];
$FWI_RED = $_POST['FWI_RED'];
$HAUTI_RED = $_POST['HAUTI_RED'];
$HAP_RED = $_POST['HAP_RED'];
$POI_RED = $_POST['POI_RED'];
$CDIFF_RED = $_POST['CDIFF_RED'];
$PI_RED = $_POST['PI_RED'];
$APAL_RED = $_POST['APAL_RED'];
$MRSA_RED = $_POST['MRSA_RED'];
$IP_RED = $_POST['IP_RED'];
$S_RED = $_POST['S_RED'];
$VTE_RED = $_POST['VTE_RED'];
$WOUND_RED = $_POST['WOUND_RED'];


ob_start();
?>

<META http-equiv='Content-Type' content='text/html; charset=UTF-8'>


<html>
<head>
<title>GCH Information Portal</title>
<style>
.style h1 {
  font-family: Arial;
  text-transform: uppercase;
  width: 450px;
  border-style:double;
  font-size:22px;

}

.style main {
  font-size:20px;
}

.style h2 {
  position:relative;
  font-size: 30px;
  font-family: Arial;
  color: black;
  text-transform: uppercase;
  width: 450px;
}

.style h3 {
  font-family: Calibri;
  text-transform: uppercase;
  font-size: 20px;
}

.img {
  height: 160px;
  width: 400px;
}


</style>
<script language="javascript" type="text/javascript"> 
function windowClose() { 
window.open('','_parent',''); 
window.close();
} 
</script>
</head>

<body bgcolor="white">

<div class="style">

        <center>

        <input type="image" src="gch.jpg" id="img" onclick="windowClose();">

        <h2>Hospital Acquired Conditions</h2>
        <h1><u>Days Since:</u></h1>
        <main>


        <h3>CLABSI:

            <font color="green"><?php echo nl2br ($CLABSI_GREEN);?></font>
            <font color="red"><?php echo nl2br ($CLABSI_RED);?></font>
        </h3>


        <h3>Fall with Injury: 
            <font color="green"><?php echo nl2br ($FWI_GREEN);?></font>
            <font color="red"><?php echo nl2br ($FWI_RED);?></font>
        </h3>

        <h3>Hospital Acquired UTI: 
            <font color="green"><?php echo nl2br ($HAUTI_GREEN);?></font>
            <font color="red"><?php echo nl2br ($HAUTI_RED);?></font>
        </h3>

        <h3>HAP: 
            <font color="green"><?php echo nl2br ($HAP_GREEN);?></font>
            <font color="red"><?php echo nl2br ($HAP_RED);?></font>
        </h3>

        <h3>Post-Op Infection: 
            <font color="green"><?php echo nl2br ($POI_GREEN);?></font>
            <font color="red"><?php echo nl2br ($POI_RED);?></font>
        </h3>

        <h3>C-DIFF: 
            <font color="green"><?php echo nl2br ($CDIFF_GREEN);?></font>
            <font color="red"><?php echo nl2br ($CDIFF_RED);?></font>
        </h3>

        <h3>Wound Dehiscence: 
            <font color="green"><?php echo nl2br ($WOUND_GREEN);?></font>
            <font color="red"><?php echo nl2br ($WOUND_RED);?></font>
        </h3>

        <h3>PI: 
            <font color="green"><?php echo nl2br ($PI_GREEN);?></font>
            <font color="red"><?php echo nl2br ($PI_RED);?></font>
        </h3>

        <h3>Accidental Punctures and Lacs: 
            <font color="green"><?php echo nl2br ($APAL_GREEN);?></font>
            <font color="red"><?php echo nl2br ($APAL_RED);?></font>
        </h3>

        <h3>MRSA:
            <font color="green"><?php echo nl2br ($MRSA_GREEN);?></font>
            <font color="red"><?php echo nl2br ($MRSA_RED);?></font>
        </h3>

        <h3>Iatrogenic Pneumothorax:
            <font color="green"><?php echo nl2br ($IP_GREEN);?></font>
            <font color="red"><?php echo nl2br ($IP_RED);?></font>
        </h3>


        <h3>Sepsis:
            <font color="green"><?php echo nl2br ($S_GREEN);?></font>
            <font color="red"><?php echo nl2br ($S_RED);?></font>
        </h3>


        <h3>VTE:
            <font color="green"><?php echo nl2br ($VTE_GREEN);?></font>
            <font color="red"><?php echo nl2br ($VTE_RED);?></font>
        </h3>

    </center>
    </table>
</div>      
</body>
</html>

<?php
$html = ob_get_contents();
ob_end_clean();

$filename = "ds.html";

file_put_contents($filename, $html);

echo file_get_contents("ds.html");
?>

2 个答案:

答案 0 :(得分：1)

复选框有时很棘手。您必须检查页面加载时是否存在该值。

$（＆＃39; #colorChange＆＃39;）。prop（＆＃39; checked＆＃39;，true）;

答案 1 :(得分：0)

尝试以下代码。并将您的标签类更改为PI_GREEN和RED 

<input type="checkbox" id="colorChange" vlaue="green">
<input type="checkbox" id="colorChange" vlaue="red">
<script>
$('#colorChange').bind('change', function () {
if ($(this).is(':checked')){
if($(this).val()=='green')
     $(".PI_GREEN").css("color", "green");
if($(this).val()=='red')
$(".RED").css("color", "green");
}
   else
     $(".PI_GREEN").css("color", "black");
     $(".RED").css("color", "black");
});
</script>
相关问题
最新问题