Schaltfläche ein- und ausblenden JavaScript

Question

Ich arbeite an dem Erweitern und Reduzieren einer Schaltfläche. Ich habe hier zwei Bilder und der Fokus sollte auf dem Element bleiben. Wenn einmal geklickt wird sollte es collapse und ein anderer Klick sollte expand sein. Ich habe versucht, das Element zu fokussieren, aber .focus() funktioniert nicht.

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 
} 

Kann jemand Idee geben, wie ich das Element konzentrieren.

Answer 1

Was ist sh? Sie haben keine Funktion mit diesem Namen angegeben. Angenommen, die Funktion wurde bereitgestellt und folgt demselben Muster, müssen Sie sicherstellen, dass der Wert b an setTimeout übergeben wird. Der Wert b in Ihrem aktuellen setTimeout ist höchstwahrscheinlich nicht definiert. Dies liegt daran, dass setTimeout standardmäßig im globalen Kontext ausgeführt wird. Stattdessen können Sie Folgendes tun:

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(); 
     } 
    } 
}