1,document.getElementById("textId").readOnly = true;
2,需要将发生时间和情况放到一个div种,document.getElementById("divId").display = none;
3,在表单提交的时候做判断。<input type="submit" onclick="valid()">;

解决方案 »

  1.   

    可以再checkbox的选中事件中动态添加一个div
      

  2.   

    L@_@K
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title> new document </title>
      <meta name="generator" content="editplus" />
      <meta name="author" content="" />
      <meta name="keywords" content="" />
      <meta name="description" content="" />
     </head> <body>
    <input type="checkbox" id="cbxIsHappened" /><label for="cbxIsHappened">发生过疫情</label>
    <span id="spaOptionArea">
    <br />发生时间 <input type="text" id="txtDate" />
    <br />详细情况 <textarea id="ttaInfo" rows="10" cols="30"></textarea></span>
    <script type="text/javascript">
    <!--
    function $(sId)
    {
    return document.getElementById(sId);
    }var isHappened = $("cbxIsHappened");
    var optionArea = $("spaOptionArea");optionArea.style.display = "none";isHappened.onclick = function() {
    if (this.checked)
    optionArea.style.display = "inline";
    else
    optionArea.style.display = "none";
    };
    //-->
    </script>
     </body>
    </html>
      

  3.   

    如何实现是由需求决定滴,
    如果需求没有明确指出如何实现,
    那么就已最简单、最容易滴方式实现,
    当然这是相对而言滴!优化了一下
    L@_@K
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title> new document </title>
      <meta name="generator" content="editplus" />
      <meta name="author" content="" />
      <meta name="keywords" content="" />
      <meta name="description" content="" />
     </head> <body>
    <input type="checkbox" id="cbxIsHappened" /><label for="cbxIsHappened">发生过疫情</label>
    <span id="spaOptionArea">
    <br />发生时间 <input type="text" id="txtDate" value="请填写疫情发生时间" />
    <br />详细情况 <textarea id="ttaInfo" rows="10" cols="30">请填写疫情详细情况</textarea></span>
    <script type="text/javascript">
    <!--
    function $(sId)
    {
    return document.getElementById(sId);
    }var isHappened = $("cbxIsHappened");
    var optionArea = $("spaOptionArea");
    var date = $("txtDate");
    var info = $("ttaInfo");optionArea.style.display = "none";function clearDefaultValue(obj)
    {
    if (obj) this = obj; if (this.value == this.defaultValue)
    this.value = "";
    }
    function resetDefaultValue(obj)
    {
    if (obj) this = obj; if (this.value == "")
    this.value = this.defaultValue;
    }isHappened.onclick = function() {
    if (this.checked)
    {
    optionArea.style.display = "inline"; date.onclick = clearDefaultValue;
    info.onclick = clearDefaultValue;
    date.onblur = resetDefaultValue;
    info.onblur = resetDefaultValue;
    }
    else
    {
    optionArea.style.display = "none";
    }
    };
    //-->
    </script>
     </body>
    </html>