ボタンを展開して折り畳むjavascript

Question

私はボタンの拡大と折り畳みに取り組んでいます。私はここに2つの画像があり、フォーカスは要素にとどまるべきです。一度クリックすると、collapseとなり、別のクリックはexpandとなります。私は要素をフォーカスしようとしましたが、.focus()は機能しません。

HTML：

<td aria-expanded="false" name="td_tohide2" id="td_tohide2" style="padding:0px;" class="sectiontd" nowrap="true" > 
    <img role="button" aria-labelledby="hide_show" id="generalinfo_caretup" src="images/arrow_up_ps_oc.png" onkeypress="sh_keypress('td_tohide2','td_toshow2','generaltable',event)" onclick="sh('td_tohide2','td_toshow2','generaltable')" tabindex="0" /> 
</td> 

<td aria-expanded="true" aria-labelledby="hide_show_" name="td_toshow2" id="td_toshow2" style="padding:0px;display:none" class="sectiontd" nowrap="true"> 
    <img role="button" id="generalinfo_caretdown" src="images/arrow_down_ps_oc.png" onkeypress="sh_keypress('td_toshow2','td_tohide2','generaltable',event)" onclick="sh('td_toshow2','td_tohide2','generaltable')" tabindex="0" /> 
</td> 

Javascriptを：

function sh_keypress(a,b,c,event){ 
    if(event.keyCode==13 || event.keyCode==32 || event.which==13 || event.which==32) { 
    if(document.getElementById(c).style.display=="none") 
     document.getElementById(c).style.display = ""; 
    else 
     document.getElementById(c).style.display = "none"; 
     document.getElementById(a).style.display="none"; //arrow images 
     document.getElementById(b).style.display=""; //arrow images 
     setTimeout("document.getElementById(b).focus()",1000); 
     event.stopImmediatePropagation(); 
    } 
    } 
function sh(a,b,c) 
    { 

if(document.getElementById(c).style.display=="none") 
    document.getElementById(c).style.display = ""; 
else 
    document.getElementById(c).style.display = "none"; 


document.getElementById(a).style.display="none"; //arrow images 
document.getElementById(b).style.display=""; //arrow images 
} 

誰がどのように要素を集中することができますアイデアを与えることができます。

Answer 1

shとは何ですか？あなたはその名前の関数を提供していません。関数が提供され、同じパターンに従っていると仮定すると、bの値がsetTimeoutに渡されていることを確認する必要があります。

現在のsetTimeoutのbの値は、おそらく定義されていません。これは、既定ではグローバルコンテキストでsetTimeoutが実行されるためです。代わりに、次のようなことをすることができます：

function sh_keypress(a,b,c,event) { 
    if(event.keyCode==13 || event.keyCode==32 || event.which==13 || event.which==32) { 
     if(document.getElementById(c).style.display === 'none') { 
      document.getElementById(c).style.display = ""; 
     } else { 
      document.getElementById(c).style.display = "none"; 
      document.getElementById(a).style.display="none"; //arrow images 
      document.getElementById(b).style.display=""; //arrow images 
      // Use a function below to provide the value of `b` from `sh_keypress` scope 
      setTimeout(function(){document.getElementById(b).focus()},1000); 
      event.stopImmediatePropagation(); 
     } 
    } 
}