让div出现在相同的位置

嗨，我想创建一个基于疾病选择症状的表单。但问题是div不显示在相同的位置。请帮我解决一下这个。让div出现在相同的位置

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> 
<html> 

<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> 
    <title>Untitled Document</title> 
    Scripting Part:script for selecting the division according to the selection option. 

    <script> 
    function testCheckbox(str) { 
     document.getElementById("diabetes").style.visibility = (str == "diabetes") ? "visible" : "hidden"; 
     document.getElementById("jaundice").style.visibility = (str == "jaundice") ? "visible" : "hidden"; 

    } 
    </script> 
    //Form Design: 

</head> 

<body> 
    <p>&nbsp;</p> 
    <p>&nbsp;</p> 
    <form action="treatment.php" method="post" name="treatmentform"> 
    <center> 
     <br>Treatments 
     <br> 
     <table width="535" border="0"> 
     <tr> 
      <td width="130">Patient ID:</td> 
      <td width="395"> 
      <input type="text" name="p_id"> 
      </td> 
     </tr> 
     <tr> 
      <td>Patient Name:</td> 
      <td> 
      <input type="text" name="p_name"> 
      </td> 
     </tr> 
     </table> 

     <p>&nbsp;</p> 
     <table width="533" border="0"> 
     <tr> 
      <td width="165">Diseases:</td> 
      <td width="358"> 
      <select name="diseases" onchange="testCheckbox(this.value);"> 
       <option value="diabetes">Diabetes</option> 
       <option value="jaundice">Jaundice</option> 
       <option value="pressure">Pressure</option> 
       <option value="depression">Depression</option> 
      </select> 
      </td> 
     </tr> 

     //Div section: 

     <tr> 
      <td height="150">Symptoms:</td> 
      <td> 
      <div id="diabetes" style="visibility: hidden;"> 
       <p> 
       <input type="checkbox" name="chkOption" value="1">Blurry vision 
       <input type="checkbox" name="chkOption2" value="1">Fatigue 
       <p> 
        <input type="checkbox" name="chkOption22" value="1">Weight loss &nbsp;&nbsp; 
        <input type="checkbox" name="chkOption222" value="1">Lack of Sensation 
        <br> 
      </div> 
      <div id="jaundice" style="visibility: hidden; font-size: 24;"> 
       <p> 
       <input type="checkbox" name="chkOption" value="1">Itching 
       <input type="checkbox" name="chkOption3" value="1">Weight loss 
       <p> 
        <input type="checkbox" name="chkOption4" value="1">Loss of Apetite 
        <input type="checkbox" name="chkOption42" value="1"> 
        <br> 

      </div> 

      //Divsection ends: 

      </td> 
     </tr> 
     </table> 
     <p>&nbsp;</p> 
     <p>&nbsp;</p> 
    </center> 
    </form> 
</body> 

</html>

我想div元素出现在相同的位置，当我切换选择选项 - >

来源

2014-10-30 DINESH KUMAR

呃......我怕我再也不会去看医生，如果他们使用这种形式的做出诊断... – Teemu 2014-10-30 17:06:15

什么div，什么位置？请提出明确的问题，提供您实现这些目标的准确目标和问题 – charlietfl 2014-10-30 17:17:13

变化能见度（隐藏/可见）由显示器（块/无），他们将出现在同一个地方。

HTML：

style="display: none;"

JS：

document.getElementById("diabetes").style.display= (str == "diabetes") ? "block" : "none";

来源

2014-10-30 17:21:55

让div出现在相同的位置

回答

相关问题