11550 sujets

JavaScript, DOM et API Web HTML5

Accesskey

Bonjour,
Je cherche comment setter dynamiquement un accessKey sur un champ input. De prime abord ça parait bateau mais mon code passe sous IE et pas sous FF Smiley eek .
Voici le ptit bout de code tout simple en question :

<html>
<head>
<script>
function init(){
	document.getElementById("inputA").accessKey = "L";
}
</script>
</head>
<body onload="init();">
<form>
<input type="text" id="inputA" name="inputA" value=""/>
</form>
</body>
</html>

J'ai essayé de mettre un libellé à mon champ via la balise LABEL (avec attribut FOR) puis de mettre dynamiquement l'accessKey sur le LABEL. Dans ce cas ça fonctionne parfaitement. Smiley cligne Hélas dans ce cas la navigation clavier diffère entre IE et FF.
Voilà pourquoi je dois mettre l'accessKey sur le champ directement.
Quelqu'un aurait une idée svp ?
Par avance merci !
Modérateur
Bonjour,

Le problème vient de la façon que tu changes l'attribut de l'élément. Fais des recherches sur Google à propos de setAttribute.

Lien direct : setAttribute
Modifié par Tony Monast (28 Apr 2009 - 18:03)
Bonjour,

j'ai constaté le même problème.

Il semblerait que le champ accesskey ne soit pas lu de manière dynamique par Firefox une fois qu'il a fini de charger la page. Autrement dit, il n'est pas possible de le modifier une fois que la page est chargée.
Si tu fait la même chose en appelant ton script JS juste avant la fin de la page au lieu de l'appeller dans le onload, ca fonctionne...

Ci dessous, un exemple de ce qui marche et qui ne marche pas :

<html>
<head>
<script>
    function load(id) {
        var aInput=document.getElementById(id);
        aInput.setAttribute('accessKey', aInput.getAttribute("title"));
        aInput.style.backgroundColor="lightblue";
    }

    setTimeout("load('setTimeout');", 2000);
</script>
</head>
<body onload="load('onload')">

    <input type="text" value="1 by JS onload" id="onload" title="1" />
    <input type="text" value="2 by JS setTimeout" id="setTimeout" title="2"/>
    <input type="text" value="3 by JS endBody" id="endBody" title="3"/>
    <input type="text" value="4 natif" accesskey="4" title="4"/>

    <script>
    load("endBody");
    </script>
</body>
</html>


Selon mes tests :
IE6 [ALT+key] : les 4 accesskey fonctionnent
IE7 [ALT+SHIFT+key] : les 4 accesskey fonctionnent
FF3.5 [ALT+SHIFT+key] : seuls les accesskey 3 et 4 fonctionnent
Opera 9.63 [SHIFT+ESC+key] : les 4 accesskey fonctionnent
Modifié par Fladnag (26 Aug 2009 - 13:25)
Sujet clos
Aller à