Comment déclencher le menu contextuel du navigateur sur un élément. (Comme si l'utilisateur cliquait sur le bouton droit de la souris)

Question

J'ai besoin de déclencher l'ouverture du menu contextuel du navigateur (IE, Firefox, Safari, etc.) via javascript. Le problème que j'essaie de résoudre, c'est quand un élément superposé est cliqué avec le bouton droit, l'élément ci-dessous montre son menu contextuel. Donc, si l'élément supérieur est une étiquette, lorsque vous faites un clic droit, je dois afficher le menu contextuel de l'élément d'entrée ci-dessous.

Je sais comment empêcher l'affichage du menu contextuel de l'étiquette, mais je ne sais pas comment ouvrir un menu contextuel de manière arbitraire.

Toute aide est appréciée!

Answer 1

Désolé d'être le porteur de nouvelles malheureuses, mais cela est impossible à faire avec Javascript.

Answer 2

Je ne veux pas vous frustrer, bien au contraire, surtout parce que vous avez répondu à ma propre question :)

Je ne pense pas que le menu contect d'un navigateur est accessible via un script ordinaire sur une page web . Si ce que vous demandez était réellement faisable, alors les fabricants de navigateurs pourraient considérer cela comme un bug et supprimer ce comportement. Cross-navigateur, ce comportement est très peu susceptible d'être disponible aujourd'hui. Pourquoi ne pas capturer les événements de la souris, et chaque fois que la souris est directement dans la zone de l'élément ci-dessous que vous souhaitez afficher le menu contextuel, appuyez sur l'élément de couverture ci-dessous, sinon sur le dessus?

C'est une possibilité que je pourrais penser, révélant/exposant fondamentalement l'élément caché en fonction de la position de la souris. Comme couper un trou dans la superposition.

Ou pourquoi ne pas rendre le champ de texte transparent et placer le calque sous le champ de texte entièrement?

Si cela ne fonctionne pas techniquement, alors vous avez au moins intérêt à classer des bogues ou des améliorations par rapport aux navigateurs ciblés.

BTW il semble que le menu contextuel fonctionne réellement si l'utilisateur clique avec le bouton droit de la souris directement sur la position du curseur, donc cela pourrait être une autre faille à considérer.

Answer 3

J'ai une solution possible qui peut répondre à vos besoins. Ce n'est pas encore parfait, je n'ai fait que quelques tests rapides dans quelques navigateurs (Fox 3.6, IE7, IE8, Chrome 4, Safari 3 sur xp) Il faudra le peaufiner et l'améliorer mais c'est un début. Fondamentalement, l'idée est de supprimer l'étiquette en faisant un clic droit sur mousedown afin que le champ désiré soit touché par l'événement mouseup et donc déclenche le menu contextuel sur le champ concerné.

// Remove the contextmenu from "In-Field" Labels 
base.$label.bind("contextmenu",function(e){ 
    return false; 
}); 

// Detect right click on "In-Field" label: 
// hide label on mousedown so mouseup will target the field underneath. 
base.$label.mousedown(function(e){   
    if (e.which == 3){ 
     var elLbl = $(this); 
     elLbl.hide(); 
     var elFid = $(this).attr("for"); 
     // bind blur event to replace the label when we are done. 
     $("#" + elFid).bind("blur.infieldlabel",function(){      
      elLbl.show(); 
      $("#" + elFid).unbind("blur.infieldlabel");      
     });    
     return false; 
    } 
}); 

Les navigateurs IE et Safari expérience d'une question étrange où vous devez cliquer et deux fois avant que l'étiquette affiche à nouveau (quelque chose à voir avec le calendrier des événements, je pense). Vous pouvez peut-être facilement voir pourquoi cela se passe en regardant le code. On remarque aussi de légers pépins parfois chez le renard après avoir collé dans le champ, sur le flou l'étiquette est apparue pendant une fraction de seconde alors qu'elle ne devrait pas l'être. Cela devrait être une chose assez simple à rectifier si vous décidez d'intégrer cette méthode dans votre code.