javascript - 使用 Javascript 单击单选按钮时隐藏 DIV

Question

我想在单击单选按钮时隐藏我的 div，但我一辈子都无法弄清楚。这是我的代码:

 <li>
     Residential&nbsp;&nbsp;&nbsp;
     <input type="radio" name="fee" id="residential" class="app_fee"
            value="<?php echo "$applicationFee_residential" ?>"
            onChange="mech_application.fee1.value = eval(mech_application.residential.value)"
            <?php if (isset($_POST['fee'])) {
                      print($residentialYes ? "CHECKED" : "");
            } ?> />
 </li>

 <li>
     Apartment/Commercial
     <input type="radio" name="fee" id="apartment" class="app_fee"
            value="<?php echo "$applicationFee_Apartment" ?>"
            onChange="mech_application.fee1.value = eval(mech_application.apartment.value)"
            <?php if (isset($_POST['fee'])) {
                      print($apartmentNo ? "CHECKED" : "");
            } ?> />
 </li>

 <li>
     Revision&nbsp;
     <input type="radio" name="fee" id="revision" class="app_fee"
            value="<?php echo "$revision" ?>"
            onChange="mech_application.fee1.value = eval(mech_application.revision.value)"
            <?php if (isset($_POST['revision'])) {
                      print($revisionYes ? "CHECKED" : "");
            } ?> />
     <?php if ($_SERVER['REQUEST_METHOD'] == 'POST') {
               if (!isset($_POST['fee'])) {
                   $problem = TRUE;
                   print '<p class="error">Please select the application type</p>';
                   $error = TRUE;
                }
           }?>
  </li>

我想在住宅或公寓或单击时隐藏此 div，并在单击修订时显示它:

 <div class="revision_hidden">
     Application ID:
     <input type="text" name="revision_application_id" size="12" maxlength="40"
            value="<?php if (isset($_POST['revision_application_id'])) {
                             print htmlspecialchars($_POST['revision_application_id']);
                    } ?>"
            placeholder="Application ID"/>
 </div>

感谢任何和所有帮助!谢谢!

Answer 1

给你的div一个id:

<div class="revision_hidden" id="my_div"> ...

向单选按钮添加 onclick 函数:

<input type="radio" name="fee" id="residential" onclick="my_function(this)" ...
<input type="radio" name="fee" id="apartment" onclick="my_function(this)" ...
<input type="radio" name="fee" id="revision" onclick="my_function(this)" ...

并添加 JavaScript 函数:

function my_function(elm)
{
    if(elm == document.getElementById('residential') || elm == document.getElementById('apartment'))
    {
        //document.getElementById('my_div').style.visibility = "hidden";
        document.getElementById('my_div').style.display = "none";
    }
    else if(elm == document.getElementById('revision'))
    {
        //document.getElementById('my_div').style.visibility = "visible";
        document.getElementById('my_div').style.display = "block";
    }
}