选择复选框显示textarea。如果未选中,则textarea值应为空

时间:2015-04-02 12:02:06

标签: javascript php html checkbox

我创建了带有2个复选框的页面,提交和重置按钮作为附加图像

enter image description here

如果我点击单选按钮,它将显示隐藏的文本区域。

enter image description here

如果我选中这两个复选框并单击提交,它将正常工作。但是,如果我只点击其中一个复选框并单击“提交”,那么它将无法正常工作。

是否可以帮助我如何通过只选择一个复选框来提交查询?

我的request_to_approve.php代码是

<html>

<script type="text/javascript">
function checkValue()
{

if(document.getElementById("reject").checked == true)
 {
   document.getElementById('xtraInfo').style.display='block';
   document.getElementById('xtraInfo1').style.display='block';
   document.getElementById('xtraInfo2').style.display='block';
   document.getElementById('xtraInfo3').style.display='block';
   document.getElementById('xtraInfo4').style.display='block';
   document.getElementById('xtraInfo5').style.display='block';

 }
else
 {
   document.getElementById('xtraInfo').style.display='none';
   document.getElementById('xtraInfo1').style.display='none';
   document.getElementById('xtraInfo2').style.display='none';
   document.getElementById('xtraInfo3').style.display='none';
   document.getElementById('xtraInfo4').style.display='none';
   document.getElementById('xtraInfo5').style.display='none';
 }
}

function checkswcr()
{

if(document.getElementById("swcr").checked == true)
 {
   document.getElementById('swcrInfo').style.display='block';
   document.getElementById('swcrInfo1').style.display='block';
   document.getElementById('swcrInfo2').style.display='block';
   document.getElementById('swcrInfo3').style.display='block';
   document.getElementById('swcrInfo4').style.display='block';
   document.getElementById('swcrInfo5').style.display='block';

 }
else
 {
   document.getElementById('swcrInfo').style.display='none';
   document.getElementById('swcrInfo1').style.display='none';
   document.getElementById('swcrInfo2').style.display='none';
   document.getElementById('swcrInfo3').style.display='none';
   document.getElementById('swcrInfo4').style.display='none';
   document.getElementById('swcrInfo5').style.display='none';
 }
}

function checkother()
{

if(document.getElementById("other").checked == true)
 {
   document.getElementById('otherInfo').style.display='block';
   document.getElementById('otherInfo1').style.display='block';
        if(document.getElementById("reject").checked == false)
                {
   document.getElementById('otherInfo2').style.display='block';
   document.getElementById('otherInfo3').style.display='block';
   document.getElementById('otherInfo4').style.display='block';
   document.getElementById('otherInfo5').style.display='block';
                }

 }
else
 {
   document.getElementById('otherInfo').style.display='none';
   document.getElementById('otherInfo1').style.display='none';
   document.getElementById('otherInfo2').style.display='none';
   document.getElementById('otherInfo3').style.display='none';
   document.getElementById('otherInfo4').style.display='none';
   document.getElementById('otherInfo5').style.display='none';
 }
}

</script>

<table id="structure">
         <tr>
                <td id="page">
                <body>

<?php
if (isset($_POST['submit']) )
        {
        $pronto = $_POST['pronto'];
        $fatal = $_POST['fatal'];
        $medi = $_POST['medi'];
        $neu = $_POST['neu'];
        $swcr = $_POST['swcr'];
        print_r($pronto);
        print_r($fatal);
        print_r($medi);
        print_r($neu);
        print_r($swcr);
        }
?>
</br>
<!doctype html public "-//w3c//dtd html 3.2//en">

<html>
        <table width="100%" align="left" cellpadding="3" cellspacing="1">
                <form name = "Register" method = "post" action = "request_to_approve.php">

       <tr>

                <td>
                PR: <input type='checkbox' name='reject' id='reject' value='Rejected' onClick="checkValue()" />
                </td>
        </tr>
        <tr>
                <td align="left">
  <div id="xtraInfo1" style="text-align:left; display:none; font-weight:bold;">
    PRONTO Details: </div></td>
                <td>
  <div id="xtraInfo" style="text-align:left; display:none; font-weight:bold;">
    <textarea  id="pronto" width="900" style="width: 650px;  resize:vertical;" name="pronto" required><?php if( $_SERVER['REQUEST_METHOD'] === 'POST' ) { print_r($_POST['rejectdt']); }?></textarea>
  </div>
                </td>
        </tr>

       <tr>
                <td>
                <div id="xtraInfo2" style="text-align:left; display:none; font-weight:bold;">Review Comments :</div></td>
                <td>

                <table>
                <tr>
                        <td  align="center">   <div id="xtraInfo3" style="text-align:left; display:none; font-weight:bold;">Fatal :- </br>
                        <textarea id="fatal" class="wmd-input processed" name="fatal" type="file" cols="31" rows="5" tabindex="50" data-min-length="" wrap=physical required></textarea>
                        </div></td>
                <td align="center"> <div id="xtraInfo4" style="text-align:left; display:none; font-weight:bold;">Medium :- </br>
                        <textarea id="medi" class="wmd-input processed" name="medi" type="file" cols="31" rows="5" tabindex="50" data-min-length="" wrap=physical required></textarea>
                                        </div></td>
                <td align="center"> <div id="xtraInfo5" style="text-align:left; display:none; font-weight:bold;">Neutral :- </br>
                        <textarea id="neu" class="wmd-input processed" name="neu" type="file" cols="31" rows="5" tabindex="50" data-min-length="" wrap=physical required></textarea>
                                        </div></td>

                </tr>
                </table>
        </tr>

       <tr>

                <td>
                SWCR/Feature : <input type='checkbox' name='swcr' id='swcr' value='swcr' onClick="checkswcr()" />
                </td>
        </tr>
        <tr>
                <td align="left">
  <div id="swcrInfo1" style="text-align:left; display:none; font-weight:bold;">
    SWCR/Feature/Backlog Details: </div></td>
                <td>
  <div id="swcrInfo" style="text-align:left; display:none; font-weight:bold;">
    <textarea  id="swcr" width="900" style="width: 650px;  resize:vertical;" name="swcr" required><?php if( $_SERVER['REQUEST_METHOD'] === 'POST' ) { print_r($_POST['swcr']); } ?></textarea>
  </div>
                </td>
        </tr>


<tr><td>
<button type="submit" name="submit" value="submit">Submit</button>
<button type="reset" value="Reset">Reset</button>
</td></tr>
        </form>
        </table>
        </table>
</html>

有人可以帮我这个

2 个答案:

答案 0 :(得分:0)

function checkswcr(){   
        var swcrInfo = document.getElementById('swcrInfo');    
        swcrInfo.style.display == 'block' ? swcrInfo.style.display = 'none' : swcrInfo.style.display = 'block';
    }

Demo

答案 1 :(得分:-1)

好吧创建一个像数字一样的隐藏字段,在第一个复选框上存储一个值click..attach你想要的功能。在第二个复选框上单击存储不同的值和函数,如果两个复选框都已单击,则将第三个值存储在同一个隐藏字段中。隐藏字段的值将准确指示如何处理click.hope它应该工作