JavaScript锁定功能，以防止递归(浏览器冻结/性能）

JavaScript lock function to prevent recursion (browser freeze/performance)

本文关键字：浏览器 冻结 性能 递归 功能 锁定 JavaScript      更新时间：2023-09-26

对于我的键盘电源键脚本，我已经为每个请求实现了一项功能，以启用up/down箭头键，以将焦点放在代表电子邮件的表格上的复选框（向上表示上面行中的复选框，向下表示下面一行的复选框）上（显然像旧的雅虎经典邮件，尽管在他们停止允许访问之前我不知道该功能）。此功能在一个小例外之外效果很好：当我按住向上箭头键（而不是点击，点击点击）时，它最终会在到达顶部复选框时锁定 Firefox;我按住它越多，它就越有可能KO浏览器，我将不得不手动终止该过程。

我对各种方法持开放态度，尽管任何涉及全局变量的方法都必须使用 option 类。

框架是明确禁止的，我们谈论的是真正的代码和性能。

选项类，除非您的方法需要全局变量，否则不是必需的...

var option = new function() {this.name = '';}

这是处理各种按键事件的函数...

function keyPressed(evt)
{
 var e = evt || event;
 var key = e.which || e.keyCode;
 if (powerKeysEnabled)
 {
  switch (key)
  {
   case 38://Up Arrow
   if (e.target.nodeName.toLowerCase()=='a' && e.target.previousSibling && e.target.previousSibling.nodeName.toLowerCase()=='input' && e.target.previousSibling.type=='checkbox' && e.target.parentNode.parentNode.nodeName.toLowerCase()=='tr')
   {
    var t;
    if (e.target.parentNode.parentNode.parentNode.parentNode.nodeName.toLowerCase()=='table') {t = e.target.parentNode.parentNode.parentNode.parentNode;}
    else if (e.target.parentNode.parentNode.parentNode.nodeName.toLowerCase()=='table') {t = e.target.parentNode.parentNode.parentNode;}
    var tr = t.getElementsByTagName('tr');
    for (var i=0; i<tr.length; i++)
    {
     if (tr[i]===e.target.parentNode.parentNode)
     {
      i--;
      if (tr[i])
      {
       var a = tr[i].getElementsByTagName('input');
       if (a[0] && a[0].type=='checkbox')
       {
        a[0].focus();
        break;
       }
       else
       {
        i--;
        if (tr[i])
        {
         var b = tr[i].getElementsByTagName('input');
         if (b[0] && b[0].type=='checkbox')
         {
          b[0].focus();
          break;
         }
        }
       }
      }
     }
    }
   }
   break;
  }
 }
}

任何对脚本如何工作感兴趣的人都应该意识到我application/xhtml+xml做XHTML，并且对正确的代码非常清楚。还应该注意的是，我用锚点替换了不可自定义的输入复选框元素并隐藏了复选框（通过 CSS position，而不是display），并在视觉上用锚元素替换每个复选框。请注意，空格在脚本如何解释 XHTML 方面在一定程度上很重要，不要为了其他人而编辑。这是一个示例 XHTML 表，它适用于...

<table summary="This table displays emails from the currently choosen folder.">
<colgroup style="width: 5%;"></colgroup>
<colgroup style="width: 20%;"></colgroup>
<colgroup style="width: 50%;"></colgroup>
<colgroup style="width: 25%;"></colgroup>
<colgroup style="width: 5%;"></colgroup>
<thead><tr><td colspan="5"><span>Delete, move, other email features...</span></td></tr><tr><td><input type="checkbox" value="" /></td><td> </td><td> </td><td> </td><td> </td></tr></thead>
<tfoot><tr><td></td><td> </td><td> </td><td> </td><td> /td></tr></tfoot>
<tbody>
<tr id="mail_inbox_208_row"><td><input type="checkbox" value="" /></td><td> </td><td> </td><td> </td><td> </td></tr>
<tr id="mail_inbox_207_row"><td><input type="checkbox" value="" /></td><td> </td><td> </td><td> </td><td> </td></tr>
</tbody>
</table>

您是否尝试过使用 setTimeout 进行延迟为 0 的"屈服"？如下所示：

function keyPressed(evt)
{
 var e = evt || event;
 var key = e.which || e.keyCode;
 if (powerKeysEnabled)
 {
    setTimeout(function() {
      //perform work here
    }, 0);
 }
}

我为复选框的id添加了一个排除项，它不再锁定; 第二个如果条件...

if (
e.target.nodeName.toLowerCase()=='a' && 
e.target.id!='mail_inbox_all_img' && 
e.target.previousSibling && 
e.target.previousSibling.nodeName.toLowerCase()=='input' && 
e.target.previousSibling.type=='checkbox' && 
e.target.parentNode.parentNode.nodeName.toLowerCase()=='tr'
)
相关文章：