javascript - 隐藏文本区域或父容器时 IE7 崩溃

Question

我有一个表单，用于检查是否打开了另一个窗口。如果是这样，它将两个输入字段的值复制到现有的只读输入字段，并通过设置 element.style.display = "none"隐藏两个可编辑文本区域。如果未打开其他窗口，则隐藏只读输入字段。

我的问题是，当我设置文本区域的 style.display = "none"时，IE7(由公司 IT 策略强制使用)会挂起，就像陷入无限循环一样。该功能在 Firefox 中运行良好，并且在 Firebug 中不会引发任何错误。如果我尝试设置文本区域、文本区域所在的表格行或包含的 div 的显示，IE7 会挂起。我尝试隐藏页面上的多个其他元素，但它只发生在每个文本区域上。

奇怪的是，我有另一个几乎相同的表单，除了它打开的表单之外，并且代码在那里工作。我被难住了。

HTML:

<table>
   <tr>
   <td class="first"><span>Source of CAPA</span></td>
   <td><span>Tracking Number(s)</span></td>
   </tr>
   <tr id="Normal">
   <td class="first"><textarea id="txtCAPASource" title="Source of CAPA" rows="3" cols="50" onfocus="highlight(this.id);" onblur="imposeMaxLength(this, 1990, event); unhighlight(this.id);" onkeyup="imposeMaxLength(this, 1990, event); adjustTextarea(this, 3);"></textarea></td>
   <td><textarea id="txtCAPATrack" title="Tracking Number" rows="1" cols="25" onfocus="highlight(this.id);" onblur="imposeMaxLength(this, 1990, event); unhighlight(this.id);" onkeyup="imposeMaxLength(this, 1990, event); adjustTextarea(this, 1);"></textarea></td>
   </tr>
   <tr id="Launched">
   <td class="first"><input type="text" id="txtLaunchedCAPASource" title="Launched Source" size="63" maxlength="63" readonly="readonly" class="grayed" /></td>
   <td><input type="text" id="txtLaunchedCAPATrack" title="Launched Tracking Number" size="30" maxlength="30" readonly="readonly" class="grayed" /></td>
   </tr>
   </table><br /><br />

Javascript:

    function hide(elementID)
    {
     var element = document.getElementById(elementID);
     element.style.display = "none";
    }

 function Startup()
 {
 if (stepnumber == "1" && document.getElementById("mastercontrol.route.esig.sigstatus.step1").value == "")
 {
  var opener = window.open("","VendQualSum");
  if (opener.document.getElementsByTagName("title")[0] != undefined && opener.document.getElementsByTagName("title")[0].innerHTML == "Vendor Qualification Summary")
  {
   document.getElementById("txtLaunchedCAPASource").value = opener.document.getElementById("txtVendor").value + " " + String.fromCharCode(8212) + " Number: " + opener.document.getElementById("txtVendorEvalNum").value;
   document.getElementById("txtLaunchedCAPATrack").value = opener.document.getElementById("mastercontrol.form.number").value;
   opener.document.getElementById("txtIntCAPANum").value = document.getElementById("mastercontrol.form.number").value;
            opener = "";
   hide("txtCAPASource");
   hide("txtCAPATrack");
  }
  else
  {
   opener.close();
   hide("txtLaunchedCAPASource");
   hide("txtLaunchedCAPATrack");
  }
 }
 else if(document.getElementById("txtLaunchedCAPASource").value != "")
 {
  hide("txtCAPASource");
  hide("txtCAPATrack");
 }
 else
 {
  hide("txtLaunchedCAPASource");
  hide("txtLaunchedCAPATrack");
 }
 }

Answer 1

解决了我的问题。我正在调用一个函数来调整页面上所有文本区域的大小(如下所示)。显然 IE 不喜欢在隐藏的文本区域上这样做，并且只是卡在无限循环中。解决方案是将函数移至相关代码上方。

function adjustTextarea(txtArea, minRows)
{
    while (txtArea.rows > minRows && txtArea.scrollHeight < txtArea.offsetHeight)
    {
        txtArea.rows--;
    }

    while (txtArea.scrollHeight > txtArea.offsetHeight)
    {
        txtArea.rows++;
    }
}